bundle.js緩慢加載

Question

bundle.js（2.4 Mb）加載需要40秒 - 1.5分鍾：

這是我的webpack.config.js ：

const webpack = require('webpack');
const config = {
 entry: {
        "App":__dirname + '/js/App.jsx'
},
output: {
    path: __dirname + '/dist',
    filename: 'bundle.js',
},
resolve: {
    extensions: ['.js', '.jsx', '.css']
},
module: {
  rules: [
    {
      test: /\.jsx?/,
      exclude: /node_modules/,
      use: 'babel-loader',
      loader: 'babel-loader?cashezdirectory'
    },
   // { test: /\.css$/, loader: 'style-loader!css-loader' }
  ]
},
externals: {
react: 'React',
jquery: 'jQuery'}
};
module.exports = config;

是否有任何方法可以加快加載速度？

Answer 1

您用於webpack的配置似乎是一個開發版本。 嘗試使用生產配置，通常提供額外的優化，如uglification和提取CSS插件。

plugins: [
    new ExtractTextPlugin('styles.css'),
    new webpack.optimize.UglifyJsPlugin({
        sourceMap: true
    })
],

這應該大大減少束大小（至少一半）。

您還應檢查服務器配置以進行進一步的優化，例如gzipping，這會將下載大小減少約5倍。