webpack css-loader + file-loader разные результаты на win / mac - PullRequest
Новая
       15

webpack css-loader + file-loader разные результаты на win / mac

0 голосов
/ 07 мая 2018

У меня есть этот случай, работает нормально на Mac ... но когда я клонировал репо на компьютере Windows, сборка генерирует разные результаты (пути), и он не работает.

Все маршруты относятся к пути сборки:

шрифты / abc.ttf 

ttf file existing here

стили / styles.less 

@font-face {
  font-family: 'abc';
  src: url(../fonts/abc.ttf);
}

примеры / example.ts 

import '../styles/styles.less';

webpack.config 

{
  test: /\.(css|scss|sass|less)$/,
  use: ExtractTextPlugin.extract({
    use: [
      {
        loader: 'typings-for-css-modules-loader',
        options: {
          modules: true,
          importLoaders: 1,
          namedExport: true,
          camelCase: true,
          sourceMap: true,
          localIdentName: '[local]',
        },
      },
      {
        loader: 'postcss-loader',
        options: { plugins: () => [autoprefixer('ie >= 9')] },
      },
    ],
  }),
},
{
  test: /\.(ttf|otf|eot|svg|woff(2)?)$/,
  exclude: /node_modules/,
  use: [{
    loader: 'file-loader',
    options: {
      name: '[name].[ext]',
      useRelativePath: true,
      outputPath: 'fonts',
    },
  }],
},

В среде Mac вывод правильный:

  • шрифт помещен в fonts/abc.ttf
  • файл css загружает его правильно с url(../fonts/abc.ttf)

В Windows, однако:

  • шрифт помещен в fonts/fonts/abc.ttf
  • файл css пытается загрузить его с помощью url(fonts/fonts/abc.ttf) (учитывая, что файл css помещен в /examples/example.css, результирующий URL будет /examples/fonts/fonts/abc.ttf, то есть 404

Так что в основном 2 вопроса:

  • почему URL дублируется (как fonts/fonts)?
  • почему css не может правильно определить относительный URL и добавить .. к своему пути?

И, главное, почему в win / mac результаты не совпадают?

1 Ответ

0 голосов
/ 23 мая 2018

Ошибка произошла из-за установки разных версий (1.1.6 против 1.1.11) Возможно, в последних версиях была обнаружена ошибка, но установка той же версии устранила проблему.

PS: различные версии были вызваны из-за очистки yarn.lock по разным причинам.

...