WebPack конфигурация для начальной загрузки шрифтов реагировать

Question

У меня есть следующий в моем webpack.config.js

module: { 
    loaders: [ 
     { 
     test: /\.jsx?$/, 
     exclude: /(node_modules|bower_components)/, 
     loader: 'babel-loader', 
     query: { 
      presets: ['react', 'es2015', 'stage-0'], 
      plugins: ['react-html-attrs', 'transform-class-properties', 'transform-decorators-legacy'] 
     } 
     }, 
     { test: /\.css$/, loader: 'style-loader!css-loader' }, 
     { test: /\.scss$/, loader: "style-loader!css-loader!sass-loader"}, 
      { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file" }, 
      { test: /\.(woff|woff2)$/, loader:"url?prefix=font/&limit=5000" }, 
      { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/octet-stream" }, 
      { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=image/svg+xml" } 
    ] 
    }, 
    output: { 
    path: __dirname + "/dist/", 
    filename: "bundle.js" 
    } 

Когда я достигаю корень моего приложения и просто перемещаться по среагировать-маршрутизатор шрифт и изображения для самозагрузки работы просто отлично. Однако, если я нахожусь на корневом пути и обновляю браузер, они загружаются относительно этого пути. Таким образом, вместо:

http://localhost:3000/fa2772327f55d8198301fdb8bcfc8158.woff 

они загружены как:

http://localhost:3000/brands/fa2772327f55d8198301fdb8bcfc8158.woff 

который означает, что я получаю 404 для каждого ресурса. Я занимаюсь некоторыми исследованиями, но я не уверен, что мне может понадобиться изменить, чтобы эти ресурсы всегда загружались абсолютно из корневого пути независимо от того, что такое путь к приложению.

Answer 1

Обычно мой webpack.config.js начинается со следующего. Попробуйте добавить output

module.exports = { 
    entry: [ 
     'webpack/hot/dev-server', 
     'webpack-hot-middleware/client', 
     './src/index', 
    ], 

    output: { 
     path: path.join(__dirname, '../../static/'), 
     filename: 'bundle.js', 
     publicPath: '/build/' 
    }, 

    // .... YOUR OTHER CONFIG HERE .... 
} 

И не забудьте включить module.output.publicPath

Answer 2

Я кончался меняю загрузчик конфигурации для всех СРВ, WOFF и т.д. файлы:

{ 
    test: /\.(eot|woff|woff2|ttf|svg|png|jpe?g|gif)(\?\S*)?$/, 
    loader: 'url?limit=100000@name=[name][ext]' 
} 

Я не уверен но почему это устраняет проблему, но я занимаюсь этим. Если я выясню особенности, я отвечу на этот ответ.