Using Webpack with React-router bundle.js Not Found
If you happen to be using the HtmlWebpackPlugin
editing directly index.html
is not an option. So, to fix this particular issue, add publicPath
and specify /
as the root folder inside webpack.config.js
:
const path = require('path')
module.exports = {
entry: './app/index.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js',
publicPath: '/'
},
// more config stuff goes below..
}
Don't forget to restart the webpack dev server for these changes to take effect
More info about publicPath
here.
You are using a relative path to describe path of the bundle.js in your index.html.
You should use absolute path for bundle.js in your index.html
Absolute path contains the root directory and all other subdirectories in which a file or folder is contained.
If it's in the same path with your index.html.
eg.
public/index.html
public/bundle.js
This would solve your problem.
<script src="/bundle.js"></script>
Adding <base href="/" />
to head tag of my index.html file before including any scripts worked for me.