Styjun

I have recently changed my webpack setup to use the dev server via webpack-dev-middleware and I noticed new warnings that I'm not familiar with and not sure what the best next step to resolve is and if these warnings stem from my original setup or something that has changed since making the switch to using a dev server.

Here are the warnings:

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets: 
 bundle.js (1.01 MiB)

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
 index (1.01 MiB)
 bundle.js

Here is my webpack.config.js:

const isDev = process.env.NODE_ENV === 'development';
const webpack = require('webpack');

module.exports = 
 mode: isDev ? 'development' : 'production',
 entry: 
 index: [
 "webpack-hot-middleware/client?path=/__webpack_hmr&timeout=20000",
 "./public/index.js"
 ]
 ,
 output: 
 path: __dirname + "/dist",
 filename: "bundle.js"
 ,
 module: 
 rules: [
 
 test: /.js$/, 
 exclude: /node_modules/, 
 loader: "babel-loader"
 ,
 
 test: /.(s*)css$/,
 use: [
 'style-loader', 
 'css-loader',
 'sass-loader'
 ],
 
 ]
 ,
 plugins: [
 new webpack.HotModuleReplacementPlugin()
 ]
;

My app.js with webpack portions:

var express = require('express');
var app = express();

var webpack = require('webpack');
var webpackDevMiddleware = require('webpack-dev-middleware');
var webpackConfig = require('./webpack.config.js');
var compiler = webpack(webpackConfig);

//Port Setting
var port = process.env.PORT || 3000;

// Tell express to use the webpack-dev-middleware and use the webpack.config.js
// configuration file as a base.
app.use(webpackDevMiddleware(compiler, 
 publicPath: webpackConfig.output.publicPath
));

app.use(require('webpack-hot-middleware')(compiler));

//Public Directory
app.use(express.static(__dirname + '/public', redirect: false));

//Webpack Compiled JS
app.use(express.static(__dirname + '/dist'));

//Routing
app.use(controllers);

//Port Listening
app.listen(port);
console.log('access at port:' + port);

and finally the command I'm using npm start:

// nf = node-foreman package
// nodemon = nodemon package

`"start": "nf run nodemon app.js"`