如何在Vue CLI中配置Webfonts-loader Webpack模块

时间:2019-07-04 07:50:42

标签: vue.js webpack

尝试将svgs作为字体添加到我的项目中,我将此代码添加到了vue.config文件中,在构建和运行时没有错误,但是也没有生成的文件,


module.exports = {
  assetsDir: "./static/",
  productionSourceMap: false,
  chainWebpack: config => {
    config.module
        .rule('font-icons')
        .test(/\.font\.js/)
        .use('minicssextract-loader')
        .loader(MiniCssExtractPlugin.loader)
        .end()
        .use('css-loader')
        .loader('css-loader')
        .end()
        .use('webfonts-loader')
        .loader('webfonts-loader')
        .options({
            files: [
                './src/assets/svg/*.svg'
            ],
            'fontName': 'intelosFont',
            html: true,
            'classPrefix': 'inls-',
            'baseSelector': '.inls',
            'types': ['eot', 'woff', 'woff2', 'ttf', 'svg'],
            'fileName': 'app.dfdfdf.[ext]'

        })
        .end()
  }
};

1 个答案:

答案 0 :(得分:1)

我向您建议file-loader { test: /\.(png|svg|jpg|gif)$/, use: [ { loader: "file-loader", options: { name: "img/[name].[ext]" } } ] }