3

最近我正在使用 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;
}

但我希望将所有 url 包含在双引号中，如下所示：

@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
    ]
};
4

0 回答 0