Преобразование / замена webpack css

Question

Я использую webpack с css-loader, style-loader и ExtractTextPlugin для генерации CSS-файлов.

Я хотел бы заменить определенные URL-адреса, используемые в этих файлах CSS.

Например:

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

должен стать

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

Шрифты не обязательно находятся в правильной относительной папке. Я использую веб-пакет для генерации 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 поставил меня на правильный путь.)