webpack build failed

Question

I am building an app with react in the front end and nodejs on the backend . y react is packed by webpack and configure my server to run concurrently with the front end. For months, i have been building my app successfully, suddenly my build begins to fail throwing warnings like below followed by errors

WARNING in ./server/~/sequelize/lib/sequelize.js Critical dependencies: 388:61-74 the request of a dependency is an expression @ ./server/~/sequelize/lib/sequelize.js 388:61-74

And errors like

ERROR in ./server/models/index.js Module not found: Error: Cannot resolve module 'fs' in /PATH/static/server/models

My webpack used to be config like below

var path = require('path');
var webpack = require('webpack');

module.exports = {
    entry: ['babel-polyfill', 'react-hot-loader/patch', path.normalize(__dirname + '/src/index')],
    devtool: 'cheap-module-source-map',
    devServer: {
        hot: true
    },
    output: {
        filename: 'bundle.js',
        publicPath: '/',
        path: path.join(__dirname, 'server')
    },
    module: {
        loaders: [
            {
                loader: 'babel-loader',
                test: /\.js$/,
                exclude: /node_modules/
            },
            {
                loader: 'style!css',
                test: /\.css$/,
                include: [path.resolve(__dirname, 'public', 'css')]
            },
            {
                test: /\.json$/,
                loader: "json-loader"
            }
        ],
        plugins: [
            new webpack.NoErrorsPlugin(),
            new webpack.DefinePlugin({
                //'process.env.NODE_ENV': JSON.stringify('development')
            }),
            new webpack.NamedModulesPlugin(),
            new webpack.HotModuleReplacementPlugin()
        ],
    }
};

ANd my server config below

var webpack = require('webpack');
var config = require('./webpack.config');
var path = require('path');
var express = require('express');
var app = express();
const http = require('http');
const port = process.env.PORT || 3000;

var compiler = webpack(config);


require('./server/config/express')(app, port, compiler, config);

const server = http.createServer(app);

// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
  app.use(function (err, req, res, next) {
    res.status(err.code || 500)
      .json({
        status: 'error',
        message: err
      });
  });
}

app.use(function (err, req, res, next) {
  res.status(err.status || 500)
    .json({
      status: 'error',
      message: err.message
    });
});

server.on('close', () => {
  models.sequelize.close();
});

My server config above is based in server folder and i wasn't expecting my webpack to build that folder. My build has being working fine for months until 3 days when it suddenly stopped throwing the errors above. It occurs to me that it is building/packaging the server folder which i wasn't expecting.

I then update my babel-loader to

 {
   loader: 'babel-loader',
   test: /\.js$/,
   exclude: [/node_modules/, /server/]
}

yet to no avail. I am really confused on how i can best configure this. My development suddenly stopped. Pls any help would be appreciated.

If you use VCS try to find out what you have changed recently — Vladyslav Nikolaiev
Some package could be updated on npm. Perhaps this is source of problem. Try next rm -rf node_modules/ and then npm install — Vladyslav Nikolaiev

Nuru Salihu Nuru Salihu · Accepted Answer · 2018-01-14T14:00:35

It turns out a colleague mistakenly referenced/imported a file from the server folder hence the issue. The line

import { authenticateUser } from '../../../server/controllers/user';

in one of the components in the src folder caused that.

webpack build failed

1 Answers