Font file not found

[dheeraja00]

I have defined my output in webpack config as:

output: {
        path: __dirname + '/dist'
    },

so all font files are also going in there, but when I execute my index.html it says ERR_FILE_NOT_FOUND

Not: Running without webpack-dev-derver, using this in chrome extension

[VernonGrant]

@dheeraja00 I was facing the same problem today. You can use the publicPath option of the file-loader module. I also ended up removing the url-loader from my webpack.config.js

A Simple Example

So imagine you want all your font files to be in the following location assets/fonts/ and your webpack config's main output path is set to assets/js/. We can then use the file-loader to emit all font files to our desired location using the outputPath option... this path is relative to your main output path.

You also have to set the publicPath option. This is the path relative to your index file so you won't end up with 404 errors. You can read more about the available file-loader option here.

module: {
        /* take a look at the publicPath option... */
        rules: [{
            test: /\.(eot|svg|ttf|woff|woff2)$/,
            use: [
                { loader: 'file-loader?name=[name].[ext]&outputPath=../fonts/&publicPath=/assets/fonts/'}
            ]}
        ]
    }