webpack-dev-server failing to include react in bundle.js

[Olliebrown]

When building from source and running on localhost with the webpack dev server, I'm finding that not all needed node_module packages are getting included. In particular, when it hits the first module that comes from app.js (which happens to be react) it is not defined in the bundle for some reason.

Specific Error That Happens

Uncaught TypeError: Cannot read property 'call' of undefined
    at __webpack_require__ (bundle.js:20)

Error occurs in the bundle at this code: modules[moduleId].call(...)

• Happens when moduleId = ./node_modules/react/index.js
• This is the first module it tries to lookup that comes from app.js and it looks like all the modules that come from that app itself are not in the modules[] array for some reason.

I'm going to keep investigating but wanted to document it here assuming others might be dealing with this.

UPDATE: This seems to only be happening with the webpack-dev-server (which is what happens when you do npm start) both the build-dev and build versions do not have this issue.

[Olliebrown]

I've found lots of people talking about similar problems that can happen with webpack-dev-server most of which are related to the fact the the dev server does not write the generated bundle(s) out to the disk but instead just serves them from memory.

I tried interrogating the results at localhost:8080/webpack-dev-server and the bundle.js is decidedly different than the one generated by running the build-dev command (and is definitely missing ./node_modules/react/index.js). Still not sure why or what to do about it!

I invented a little work around for myself that involved the following:

• install npm-run-all as a dev-dependency
• Modify the package.json script section as follows:

  "scripts": {
  "build-dev": "webpack --mode=development",
  "build": "webpack --mode=production",
  "start": "run-p watch-dev server",
  "watch-dev": "webpack --mode=development --watch",
  "server": "cd public; python -m SimpleHTTPServer 8000"
  },

• This expects your console to be bash and that python 2 is installed (for simpleHTTPServer)

This way when I run start I at least get a local http server and it will re-bundle when changes happen but it does not refresh the browser page (have to do that manually).

[matheowis]

On my end npm start works perfectly fine.

Are you working on linux? My colleague had some wierd errors while using webpack-dev-server on linux.

You could also try to increase version of webpack-dev-server via npm i --save-dev webpack-dev-server@3.2.1 as suggested here

[Olliebrown]

I am on MacOS Mojave (10.14.6) so very linux like. I will explore the dev server version and also see if I might have something installed globally on my machine that is being used inadvertently.

[hichemfantar]

I rewrote the project in typescript and a new ui as an effort to maintain it https://github.com/hichemfantar/hdri-to-cubemap-converter feel free to open an issue and don't forget to leave a star ⭐