extract-text-webpack-plugin不会在quote(s)中包装font-face url路径

时间:2017-05-25 21:44:42

标签: webpack extracttextwebpackplugin

最近我正在使用extract-text-webpack-plugin将多个css文件合并为单个大文件。最近一切正常,但我不满足于这个插件生成的“没有引用的url路径”。现在它生成url(path),如何将其更改为url("path")

这是main.css生成的extract-text-webpack-plugin

@font-face {
  font-family: 'fontello';
  src: url(/assets/fonts/fontello.eot);
  src: url(/assets/fonts/fontello.eot#iefix) format('embedded-opentype'),
       url(/assets/fonts/fontello.woff2) format('woff2'),
       url(/assets/fonts/fontello.woff) format('woff'),
       url(/assets/fonts/fontello.ttf) format('truetype'),
       url(/assets/fonts/fontello.svg#fontello) format('svg');
  font-weight: normal;
  font-style: normal;
}

但我希望所有网址都包含在双引号中,如下所示:

@font-face {
  font-family: 'fontello';
  src: url("/assets/fonts/fontello.eot");
  src: url("/assets/fonts/fontello.eot#iefix") format('embedded-opentype'),
       url("/assets/fonts/fontello.woff2") format('woff2'),
       url("/assets/fonts/fontello.woff") format('woff'),
       url("/assets/fonts/fontello.ttf") format('truetype'),
       url("/assets/fonts/fontello.svg#fontello") format('svg');
  font-weight: normal;
  font-style: normal;
}

我的webpack.config.js看起来像这样:

var ExtractTextPlugin = require("extract-text-webpack-plugin");
var extractTextCSS = new ExtractTextPlugin("assets/css/[name].css");

module.exports = {
    ...

    module: {
        rules:[                
            { test: /\.css$/, exclude: __dirname + "/node_modules/", use: extractTextCSS.extract("css-loader") },
            { test: /\.(eot|svg|ttf|woff|woff2)$/, exclude: __dirname + "/node_modules/", use: "file-loader?name=assets/fonts/[name].[ext]" }
        ]
    },


    plugins: [
        extractTextCSS
    ]
};

0 个答案:

没有答案