1

I'm trying to set up a webpack server with Express.

When I use a simple script, such as the following:

document.getElementById('testing').innerHTML = "It's a test";

if (module.hot) {
    module.hot.accept();
}

The server works fine, both from the same machine and from other devices in the same network.

However, when I try to require Express, it breaks with 25 errors.

Here's what I've got:

webpack.config.js

const path = require('path');

module.exports = {
    entry: './app/serverTest.js',
    mode: 'development',
    output: {
        filename: 'bundled.js',
        path: path.resolve(__dirname, 'app')
    },
    devServer: {
        before: (app, server) => {
            server._watch('./app/**/*.html');
        },
        contentBase: path.join(__dirname, 'app'),
        hot: true,
        port: 4000,
        host: '0.0.0.0'
    },
}

serverTest.js

let express = require('express');

let app = express();

alert('This is a test');

I'm not even using the Express code. Just by requiring it, I get errors.

Here's the VSCode console logging: https://justpaste.it/342o0 (external link because it's very long)

Set
  • 183
  • 9
  • 1
    `entry: './app/serverTest.js'` you're telling Webpack to bundle `serverTest.js`. Is this really what you want? I thought you just wanted to use Express as a dev server? To use Express as a dev server, follow the instructions [here](https://webpack.js.org/guides/development/#using-webpack-dev-middleware). – blex Dec 14 '20 at 22:35
  • That's it! By following the instructions I got the server to work. Thanks! However, hot reloading is not working any more. How can I do that with middleware? – Set Dec 15 '20 at 04:00
  • 1
    Oh, there's another middleware! The hot middleware: https://github.com/webpack-contrib/webpack-hot-middleware. If anyone is in the same situation as me, check the examples. – Set Dec 15 '20 at 04:27

0 Answers0