minhtranite / react-notifications

Notification component for ReactJS
https://www.npmjs.com/package/react-notifications
287 stars 65 forks source link

error loading notification fonts via webpack #14

Open raythree opened 8 years ago

raythree commented 8 years ago

Hi, using webpack to load the css as document and getting this error:

ERROR in ./~/react-notifications/lib/fonts/notification.eot?s3g3t9
Module parse failed: /home/app/node_modules/react-notifications/lib/fonts/notification.eot?s3g3t9 Unexpected token (1:0)
You may need an appropriate loader to handle this file type.

For my webpack config I have:

module: {
    loaders: [
      {test: /\.js$/, exclude: /node_modules/, loaders: ['babel']},
      {test: /\.eot(\?v=\d+.\d+.\d+)?$/, loader: 'file'},
      {test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url?limit=10000&mimetype=application/font-woff"},
      {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'},
      {test: /\.(jpe?g|png|gif)$/i, loader: 'file?name=[name].[ext]'},
      {test: /\.ico$/, loader: 'file?name=[name].[ext]'},
      {test: /(\.css|\.scss)$/, loaders: ['style', 'css?sourceMap', 'postcss', 'sass?sourceMap']}
    ]
  },

Any suggestions? Thanks.

minhtranite commented 8 years ago

You can try my webpack config in example directory here : https://github.com/vn38minhtran/react-notifications/blob/master/example/webpack.config.js#L109

netojose commented 8 years ago

How I fixed: I used file loader, to move font files to public path. With my configuration, no public path, a fonts folder is created, and the font files are stored inside him. So, the publicPath parameter says to use app base path as reference, working well

{
    test: /\.(ttf|eot|svg|woff(2)?)(\S+)?$/,
    loader: 'file-loader?publicPath=/&name=fonts/[name].[ext]'
}