Running a node express server using webpack-dev-server

Question

I\'m using webpack to run my react frontend successfully using the following config:

{
    name: \'client\',
    entry: \'./scripts/main.js\',
    output: {
         


        

Answer 1

Just faced the same issue and came with another solution (found out more information about it later, but here it is).

Instead of using the webpack-dev-server, use the webpack --watch command so files are compiled again upon changes. Once the files are updated on the dist (or any other compiled files folder) you can set to run the nodemon on the dist folder and watch only the dist files.

This way it is possible to have the express server running and serving the front-end as you would in a production environment (or kinda) and benefit from the fast reloads.

Here's a link with some solutions to combine the webpack watch and nodemon.

My scripts section is something like this at this moment (I'm using the run-all solution):

  "scripts": {
    "serve": "npm-run-all --parallel serve:webpack serve:nodemon",
    "serve:webpack": "webpack --progress --colors --watch",
    "serve:nodemon": "nodemon ./dist/app.js --watch dist"
  },