构建 VITE 应用程序时如何分配自定义 CSS 文件名？

Question

是否可以在 VITE 中构建并使用application-name.cssor my-site-name.css？

VITE 可以选择构建自定义 JS 文件，但不能构建自定义 CSS 或 SCSS 文件（用于导出）。

https://vitejs.dev/guide/build.html#library-mode

VITE 构建名称：style.css

Answer 1

这是我的vite.config.js，用于自定义 css 文件名：

   rollupOptions: {
      output: {
        assetFileNames: (assetInfo) => {
          if (assetInfo.name == 'style.css')
            return 'customname.css';
          return assetInfo.name;
        },
      }

Answer 2

这在最新版本中似乎更加强大。当前的解决方案最初对我不起作用。

build: {
    lib: {
      name: 'LIBRARYNAME',
      fileName: 'LIBRARYNAME',
    },
    rollupOptions: {
      output: {
        assetFileNames: "LIBRARYNAME.[ext]",
      },
    },
  },

这会产生：

dist/LIBRARYNAME.css      
dist/LIBRARYNAME.cjs.js  
dist/LIBRARYNAME.cjs.js.map 
dist/LIBRARYNAME.umd.js   
dist/LIBRARYNAME.umd.js.map

如果没有名称和文件名，JS 文件将以默认名称结束。如果没有 rollup 选项，CSS 文件将以style.css.