Question

我正在使用带有css-loader，style-loader和ExtractTextPlugin的webpack来生成css文件。

我想替换这些CSS文件中使用的某些网址。

例如：

url('../fonts/icomoon.ttf?asbl3h') 
url('../../fonts/whatever.ttf?asbl4h')

应该成为

url('fonts/icomoon.ttf?asbl3h')
url('fonts/whatever.ttf?asbl4h')

字体不一定在右侧相对文件夹中。我使用webpack生成带有插件的css，将所有字体复制到某个文件夹。

这样做的最佳方式是什么？

作为后备，只需执行字符串替换即可。

Answer 1

绝对不确定这是否是最好的方法，但是对于那些不得不依靠字符串替换的人来说，这是我如何使用string-replace-loader来解决类似问题并为需要修改的文件：

  module: {
    rules: [
      {
        test: REGEX_MATCHING_ONLY_FILES_TO_BE_MODIFIED,
        use: [
          {
            loader: 'string-replace-loader',
            options: {
              search: "url\\('\(.*)fonts/", // these regular expressions should work for the example paths in the question
              replace: 'url(fonts/\1)',
              flags: 'g',
            }
          },
          // any other loaders you need, e.g. css-loader //
        ],
      },
    ],
  }

（信用：jakenuts在webpack-contrib#27上的回复使我走上了正轨。）

webpack转换/替换css url

1 个答案: