how to compile one css file for each input file or compile css contents into each output js file when with multiple entry files

[youseries]

vite.config.ts file as follows :

import { defineConfig, UserConfigExport } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path'
import { splitVendorChunkPlugin } from 'vite'

const buildBaseConfig = (sourcemap: boolean) => {
  const config: UserConfigExport = {
    plugins: [vue(), splitVendorChunkPlugin()],
    base: "./",
    build: {
      emptyOutDir: true,
      sourcemap,
      chunkSizeWarningLimit: 2000,
      outDir: '../baskadapt/src/main/resources/baskadapt/js',
      rollupOptions: {
        input: {
          designer: resolve(__dirname, './src/editor/designer.ts'),
          test: resolve(__dirname, './src/test/test.ts'),
        },
        output: {
          chunkFileNames: '[name].js',
          entryFileNames: '[name].js',
          assetFileNames: 'assets/[name].[ext]'
        }
      }
    }
  };
  return config;
};

const product = defineConfig(buildBaseConfig(false));

const integration = defineConfig(buildBaseConfig(true));

export default ({ mode }) => {
  if (mode === 'product') {
    return product;
  } else {
    return integration;
  }
}

I have multiple input files，when run "npm run integration"，vite compile multiple css files for each input file，the output css files as below：

How to compile one css file for each input file when vite compile or compile css contents into each output js file?