ERROR in multi app -- Cannot resolve module 'webpack/hot/dev-server'

[LarryEitel]

Trying to get your package running on Windows. When I run npm run dev I get the following error:

ERROR in multi app
Module not found: Error: Cannot resolve module 'webpack/hot/dev-server' in F:\_vms\HomesteadCode\xapp\refapps\web-react\conf\..\app
 @ multi app

ERROR in multi vendors
Module not found: Error: Cannot resolve module 'webpack/hot/dev-server' in F:\_vms\HomesteadCode\xapp\refapps\web-react\conf\..\app
 @ multi vendors

ERROR in Loader F:\_vms\HomesteadCode\xapp\refapps\web-react\node_modules\babel\index.js didn't return a function
 @ multi app

Any suggestions would be appreciated. Thank You. :)

[darul75]

try installing webpack globally

npm install -g webpack

and perhaps

npm install -g webpack-dev-server

but normaly

npm install

is enough

Sorry for inconvenience

[LarryEitel]

Thank you @darul75 for your prompt reply. I had jumped through that hoop without success. webpack and webpack-dev-server are both installed globally. Additionally, npm run build complained that the following packages are were not found. I manually installed then locally.
'''
html-webpack-plugin
clean-webpack-plugin
extract-text-webpack-plugin

At this point I am hung up with there two errors: 

Version: webpack 1.11.0
Child
Hash: 1102560f1564f6f8582e
Version: webpack 1.11.0
Time: 1202ms
[0] multi vendors 100 bytes {0} [built]
factory:0ms building:1ms dependencies:73ms = 74ms
+ 316 hidden modules

ERROR in Loader F:\_vms\HomesteadCode\xapp\refapps\web-react\node_modules\babel\index.js didn't return a function

Child
Hash: 45ae6ede160d96bcc26d
Version: webpack 1.11.0
Time: 109ms
[0] multi main 28 bytes {0} [built] [1 error]
factory:1ms building:0ms = 1ms
+ 1 hidden modules

ERROR in Loader F:\_vms\HomesteadCode\xapp\refapps\web-react\node_modules\babel\index.js didn't return a function
 @ multi main

I temporarily disabled Uglify.

As aside, I was able to successfully install your package on a production server.

Thank you for helping me, and other Windows developers, to get this nice package working on Windows.

[darul75]

first thank you for providing such details.

I am on windows too right now, I have erased my node_modules folder, installed npm packages again, and is has worked.

I can not figure out what is happening in packages you have described because there are defined in package.json dependencies. I mean for

html-webpack-plugin
clean-webpack-plugin
extract-text-webpack-plugin

https://github.com/darul75/web-react/blob/master/package.json

Then I know there can be some issues with babel versions, but I have no solution yet...rrr

[LarryEitel]

I ripped out my global node_modules and reinstalled/repaired node. In the process of reinstalling web-react I re-encountered a problem installing Contextify. I don't recall how I finally resolved it. Did you do anything special to get Contextify installed on your Windows box?

[LarryEitel]

Ok I got it running!!!!

For anyone tuned in, here's how "I" got contextify working. See my response to contextify/issues/159

[darul75]

great job, hope you can enjoy to play with this kit now, sorry but I could not help you, windows is specific, and yes I remember I had to install many things here too to make node working well.

[ghost]

On windows machines, webpack-dev-server hast to be installed not only globally like on linux machines, but also locally.
So do

1. npm install -g webpack-dev-server
   then also do
2. npm install --save webpack-dev-server for local installation.
   I had the same issue, and this worked on my windows machine.

[darul75]

Hi, thanks for reporting it, maybe I will add it to local dev dependencies in package.json

[avegancafe]

Just following up, @moneyonrails I just had to do the same thing of installing webpack-dev-server locally on a mac

[mantielero]

I face this issue this days. I had webpack installed globally:
npm install -g webpack

I solved by linking to the global installation:
$ npm link webpack

I hope this might help others.

[greyvugrin]

Was having issues on a Mac - same message about 'webpack/hot/dev-server' not found. It went away after adding this to my webpack config:

  resolve: {
    modulesDirectories: [path.resolve(__dirname, 'node_modules')]
  },

[darul75]

hi thx @greyvugrin @mantielero , I will update it as soon as possible.

[maticicero]

I had a similar issue and it was because I didn't have .js file extension registered on resolve.extensions:

resolve: {
    extensions: ['', '.ts', '.tsx', '.js'] // <-- Had to add the .js one
}

[DMcCoder]

@mantielero great catch! This worked for me. I'm on a mac as well, just for reference.

[lekhnath]

@maticicero yes that did the trick.

[manshi09]

I am new to react and had the same issue on Mac, I installed webpack-dev-server locally..
npm install -g webpack-dev-server
npm install --save webpack-dev-server
on running npm-start, I got babel loader issue, which was solved by changing webpack.config.js file as follows-
loaders: [
{
test: /.jsx?$/,
exclude: /node_modules/,
loader: 'babel-loader',

          query: {
             presets: ['es2015', 'react']
          }
       }

this worked for me..:)

[Sedaj]

There was a legend about a man, who understands webpack. He could tear up a bear with a singe hand, he could stop a train with his own body, and he understood a diagram in webpack hot-reload documentation https://webpack.github.io/docs/hot-module-replacement-with-webpack.html. His name was @moneyonrails.

After several days, my journey came to and end. I installed the webpack-dev-server locally as he suggested, more or less I did it as a joke becuase I knew it wouldn't change a thing, and then run server as ./node_modules/webpack-dev-server/bin/webpack-dev-server.js, suddenly, HRM started to work.

[avegancafe]

Seriously, it's magic @Sedaj. I have no idea how @moneyonrails figured it out

[bsingh1505]

For me replacing "loader: 'babel'" with "loader: 'babel-loader'" Worked

[john-osullivan]

I was getting this error in a different context, using webpack-hot-reload in the Meteor build process. @binodonline 's solution worked for me!

[VijayHYadav]

$ yarn run start
yarn run v1.7.0
$ webpack-dev-server --mode development
i ｢wds｣: Project is running at http://localhost:8080/
i ｢wds｣: webpack output is served from /
× ｢wdm｣: Hash: 11b7fe53fd1a09e0f83c
Version: webpack 4.14.0
Time: 2152ms
Built at: 2018-07-01 13:13:05
Asset Size Chunks Chunk Names
bundle.js 822 KiB main [emitted] main
Entrypoint main = bundle.js
[./node_modules/ansi-html/index.js] 4.16 KiB {main} [built]
[./node_modules/ansi-regex/index.js] 135 bytes {main} [built]
[./node_modules/events/events.js] 8.13 KiB {main} [built]
[./node_modules/html-entities/index.js] 231 bytes {main} [built]
[./node_modules/loglevel/lib/loglevel.js] 7.68 KiB {main} [built]
[./node_modules/querystring-es3/index.js] 127 bytes {main} [built]
[./node_modules/strip-ansi/index.js] 161 bytes {main} [built]
[0] multi (webpack)-dev-server/client?http://localhost:8080 ./src/code.ts 40 bytes {main} [built]
[./node_modules/url/url.js] 22.8 KiB {main} [built]
[./node_modules/webpack-dev-server/client/index.js?http://localhost:8080] (webpack)-dev-server/client?http://localhost:8080 7.75 KiB {main} [built]
[./node_modules/webpack-dev-server/client/overlay.js] (webpack)-dev-server/client/overlay.js 3.58 KiB {main} [built]
[./node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 1.05 KiB {main} [built]
[./node_modules/webpack/hot sync ^./log$] (webpack)/hot sync nonrecursive ^./log$ 170 bytes {main} [built]
[./node_modules/webpack/hot/emitter.js] (webpack)/hot/emitter.js 77 bytes {main} [built]
[./node_modules/webpack/hot/log.js] (webpack)/hot/log.js 1010 bytes {main} [optional] [built]
+ 10 hidden modules

ERROR in multi (webpack)-dev-server/client?http://localhost:8080 ./src/code.ts
Module not found: Error: Can't resolve './src/code.ts' in 'E:\project\rxjsWokout'
@ multi (webpack)-dev-server/client?http://localhost:8080 ./src/code.ts
i ｢wdm｣: Failed to compile.

[PavelMishin]

In my case this issue was due of exclamation mark on the end of project folder name.

[cookcc]

the above methods that i try fail，finally figure out my problem method is use specific version webpack-dev-sever， like 3.1.0 and on on