vite build vue3 mpa common component

[mannix-lei]

When using Vite to bundle a Vue 3 Multi-Page Application (MPA) with two entry points corresponding to two projects, and these projects share a common component, the issue is that when individually bundled, the output consists of one JS and one CSS file per project. However, when both projects are bundled simultaneously, the common component is extracted into a separate JS and CSS file. How can this issue be resolved?

here is my build options:

build: {
    dynamicImportVarsOptions: {},
    rollupOptions: {
      input: {
        ...pages,
      },
      output: {
        entryFileNames: 'static/js/[name].js',
        assetFileNames: 'static/[ext]/[name].[ext]',
        chunkFileNames: 'static/js/[name].js',
      },
    },
  }

pages:

import path from 'path';

export default {
  index: path.resolve(__dirname, '/public/index.html'),
  nested: path.resolve(__dirname, '/public/nested.html'),
};