MainTemplate.hooks.startup has been removed (use RuntimeGlobals.startup instead)

Viewed 683

I am watching a video that teaches me to join to react with the back-end, everything is fine after putting the middlwares I always get an error, and I tried to solve it but I could not

Error:

C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\lib\MainTemplate.js:100
                                        throw new Error(
                                        ^

Error: MainTemplate.hooks.startup has been removed (use RuntimeGlobals.startup instead)
    at Object.tap (C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\lib\MainTemplate.js:100:12)
    at LiveReloadPlugin.applyCompilation (C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack-livereload-plugin\index.js:164:42)
    at Hook.eval (eval at create (C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:100:1)
    at Hook.CALL_DELEGATE [as _call] (C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\node_modules\tapable\lib\Hook.js:14:14)
    at Compiler.newCompilation (C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\lib\Compiler.js:993:26)
    at C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\lib\Compiler.js:1035:29
    at Hook.eval [as callAsync] (eval at create (C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\node_modules\tapable\lib\Hook.js:18:14)
    at Compiler.compile (C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\lib\Compiler.js:1030:28)
    at C:\Users\Danjos02\Desktop\Cursos\React-Curso\react-node-project\node_modules\webpack\lib\Watching.js:112:19

I got the original webpack of the video but still the error is not solved, so I doubt that it is something of the code, but still I can not solve since I am new to this topic

Webpack.config.js code

import webpack from 'webpack';
import htmlWebpackPlugin from 'html-webpack-plugin';
import LiveReloadPlugin from 'webpack-livereload-plugin';

export default {
    entry: './src/client/index.js',
    output: {
        path: '/',
        filename: 'bundle.js'
    },
    module: {
        rules: [
            {
                use: 'babel-loader',
                test: /\.js$/,
                exclude: /node_modules/
            },
            {
                use: ['style-loader', 'css-loader'],
                test: /\.css$/
            },
            {
                test: /\.scss$/,
                use: [
                    {
                        loader: 'style-loader'
                    },
                    {
                        loader: 'css-loader', options: {
                            sourceMap: true
                        }
                    },
                    {
                        loader: 'sass-loader', options: {
                            sourceMap: true
                        }
                    }
                ]
            }
        ]
    },
    plugins: [
        new htmlWebpackPlugin({
            template: 'src/client/index.html'
        }),
        new LiveReloadPlugin()
    ]
}

Server.js

import express from 'express';
import webpack from 'webpack';
import webpackDevMiddleware from 'webpack-dev-middleware';
import webpackConfig from '../webpack.config';

// initializing packages
const app = express();

// settings
app.set('port', process.env.PORT || 3000);

// middlwares
app.use(webpackDevMiddleware(webpack(webpackConfig)));

// routes
app.get('/', (req, res) => {
  res.send('Hello World');
});

app.get('/api', (req, res) => {
  res.json({api: 'works!'});
});

// starting the server
app.listen(app.get('port'), () => {
  console.log(`Server on port ${app.get('port')}`);
});

I have read and apparently the error is from the webpack-livereload-plugin, but I could not detect the error

If anyone knows why this error occurs please help me

0 Answers
Related