webpack bundle.js not found

Question

I use webpack dev server, but can\'t access my bundle.js file.

Edit: I am using this webpack config without bower-webpack-plugin.

Answer 1

The problem mostly with pointing bundle js in index.html. The reason webpack bundle.js not found because you need to specify absolute path in index.html. Say suppose your bundle.js and index.html is generated under dist folder then it should be something like below

<script src="/bundle.js"></script>

Answer 2

Specify the home page In .env file

PUBLIC_URL=https://example.com

This worked for me.

Answer 3

I'd try to change your script path in index.html file to:

<script type="text/javascript" src="bundle.js"></script>

Answer 4

According to your package.json you are using the new babel 6 release. However you don't have all the required dependencies for this new release. According to babel-loader you need to install babel-preset-es2015 too:

npm install babel-loader babel-core babel-preset-es2015 --save-dev

As you are also using React, you need the react preset to be installed too. So install both:

npm install --save-dev babel-preset-es2015 babel-preset-react

Create a file in your package folder called .babelrc to keep the babel configuration and enable both presets:

.babelrc

{
  "presets": ["es2015", "react"]
}

And then run the server again:

npm run dev

Then http://localhost:8090/assets/bundle.js should show the bundled module.

My diagnosis:

You cannot get the the bundle.js because your npm run dev throws some errors trying to apply the babel loader because it is not properly configured. Then, when you try to request the bundle.js file you get a 404 error because it has not been generated.