CSS 和字体资产的 Vite Rollup 配置-解网

问：

我正在使用 Vite 将 scss 和 js 资产部署到我的 CDN 并在我的网站上使用它们。它可以看作是 Vite 的类似库的模式用法。

总而言之，它正在工作，但所有文件（css、js、font-files）都直接内置在 dist 文件夹中。我想将字体文件存储在 /dist/font 文件夹中。

我怎么能配上呢？我已经尝试用“font/”作为 assetFileNames 的前缀，但这会导致所有文件都内置到 /dist/font 中。

这是我的vite.config.js

import { resolve } from 'path'
import { terser } from 'rollup-plugin-terser'
import inject from '@rollup/plugin-inject'

export default {
    base: './',
    build: {
        rollupOptions: {
            input: {
                app: resolve(__dirname, 'src/js/app.js'),
                a: resolve(__dirname, 'src/scss/theme-a.scss'),
                b: resolve(__dirname, 'src/scss/theme-b.scss'),
                c: resolve(__dirname, 'src/scss/theme-c.scss')
            },
            output: {
                assetFileNames: '[name].[ext]',
                chunkFileNames: '[name].js',
                entryFileNames: '[name].js'
            },
            plugins: [
                inject({
                    modules: {
                        $: 'jquery',
                        jQuery: 'jquery'
                    }
                }),
                terser({
                    format: {
                        comments: false
                    }
                })
            ]
        }
    }
}

配置 vite CDN 汇总

CSS 和字体资产的 Vite Rollup 配置

Vite Rollup config for css and font assets

评论