React build не может правильно загрузить шрифты

Question

В режиме разработки шрифты и вообще все ресурсы успешно загружаются React. Проблема возникает, когда я создаю сборку проекта и загружаю ее на свой сервер express: приложение ищет шрифты в неправильном каталоге и поэтому не находит их. Вместо этого изображения загружаются правильно и необходимы для этого URL: / static / media . Поиск шрифтов в этом каталоге: / static / css / static / media ; это, конечно, неправильно, поскольку производственные шрифты находятся в той же папке, из которой загружаются изображения, а искомый путь не существует.

Загружаются шрифты в формате css file, таким образом:

@font-face {
  font-family: 'Rawson';
  src: url("../assets/fonts/RawsonPro-Medium.otf") format('opentype');
  font-weight: 500;
}

Я знаю, что есть другие подобные проблемы, особенно на github, но я не могу действительно решить их. Похоже, многие проблемы были решены с помощью обновления пакета activ-scripts и с использованием свойства homepage.

  "homepage": "./"

Хотя я это и сделал, я не могу найти решение. Спасибо тем, кто решил мне помочь.

Answer 1

в конфигурации вашего веб-пакета проверьте его

module.exports = {
  entry: './src/app.js',
  output: {
    path: __dirname + '/dist',
    filename: 'build.js'
  },
  module: {
    loaders: [
      {
        test: /\.scss$/,
        loader: 'style-loader!css-loader!sass-loader'
      },
      {
        test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
        use: [
          {
            loader: 'file-loader',
            options: {
              name: '[name].[ext]',
              outputPath: 'fonts/'
            }
          }
        ]
      }
    ]
  },
  watch: true
}

он должен быть создан в указанном вами пути к файлу