Question

我最近更改了我的Webpack设置，以通过webpack-dev-middleware使用开发服务器，我注意到我不熟悉的新警告，并且不确定下一步的最佳解决方法以及这些警告是否源自我的原始设置或自切换为使用开发服务器以来发生的变化。

以下是警告：

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

这是我的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()
    ]
};

我的app.js中包含Webpack部分：

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);

最后是我正在使用的命令npm start：

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

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

Webpack开发中间件4尺寸警告

0 个答案: