Webpack占用9GB内存正常吗？答案

【问题标题】：Is it normal for Webpack to take over 9GB of memory?Webpack占用9GB内存正常吗？
【发布时间】：2018-03-22 10:07:27
【问题描述】：

根据 Ubuntu node 上的任务管理器，有 8 个进程正在运行，占用 900mb 到 1.3gb 的内存。

感觉太过分了。幸好我的电脑有 12GB 内存，但这是否太多了？如果有，知道为什么这么多吗？

当 webpack 检测到更改并开始运行时，我的计算机确实经常死机并且有时会打嗝。

webpack：^3.6.0，bundle tracker：^0.2.0，dashboard：1.0.0-5，webpack-dev-server：^2.2.0，babel：^6.3.26

我正在使用 WebpackDevServer，例如：

new WebpackDevServer(webpack(config), {
    headers: {
        'Access-Control-Allow-Origin': '*',
        'Access-Control-Allow-Headers': 'Content-Type, Authorization, x-id, Content-Length, X-Requested-With',
        'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS'
    },

    historyApiFallback: true,
    hot: true,
    publicPath: config.output.publicPath,
    quiet: true,    // Shows WebpackDashboard instead.
    watchOptions: {
        aggregateTimeout: 300,
        poll: 1000
    }
}).listen( ... );

这是我的 webpack 文件：

const config = {
    context: __dirname,

    devtool: 'eval-cheap-module-source-map',

    module: {
        loaders: [
            {
                test: /\.js[x]?$/,
                exclude: /node_modules/,
                loader: 'babel-loader'
            },
            {
                test: /\.s[ac]ss$/,
                exclude: '/node_modules/',
                use: [{
                    loader: 'style-loader',
                    options: {
                        sourceMap: true
                    }
                }, {
                    loader: 'css-loader',
                    options: {
                        sourceMap: true
                    }
                }, {
                    loader: 'sass-loader',
                    options: {
                        sourceMap: true,
                        includePaths: [path.resolve(__dirname)]
                    }
                }]
            },
            {
                test: /\.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
                exclude: '/node_modules/',
                loader: 'file-loader'
            },
            {
                test: /\.(jpe?g|png|gif)$/,
                exclude: '/node_modules/',

                // If an image is less than 10kb, use data-url for images, otherwise
                // falls back to file-loader.
                loaders: ['url-loader?limit=10000&name=images/[hash:12].[ext]']
            }
        ]
    },

    resolve: {
        descriptionFiles: ['package.json'],
        extensions: ['.js', '.jsx', '.scss'],
        mainFiles: ['index'],
        modules: ['node_modules', path.resolve(__dirname)],
    }
};

config.entry = {
    main: [
        'react-hot-loader/patch',
        'babel-polyfill',
        './index.jsx',
        'webpack/hot/only-dev-server',
        `webpack-dev-server/client?http://${ localConfig.ip }:${ localConfig.port }`
    ]
};


config.output = {
    path: path.resolve('./dist/'),
    publicPath: `http://${ localConfig.ip }:${ localConfig.port }/assets/bundles/`,
    filename: '[name].js'
};


config.plugins = [
    new webpack.HotModuleReplacementPlugin(),

    new webpack.NoEmitOnErrorsPlugin(),

    // Used by Django.
    new BundleTracker({ filename: './webpack-stats-dev.json' }),

    new webpack.NamedModulesPlugin(),

    new DashboardPlugin(dashboard.setData)
];

如果有人知道一个很好的故障排除步骤列表，那将非常有帮助。

【问题讨论】：

是的，这太过分了。你确定他们正确退出了吗？也就是说，如果你停止 webpack 服务器，你最终会得到 0 个节点进程还是 7 个？
当我停止进程时所有节点进程都消失了。
哦，第一次运行显示所有 8 个进程，1 个占用 1gb，7 个仅占用 300mb。在第二次运行后，大多数进程达到 1gb，到第 4 次或第 5 次运行时，它们都达到或超过 1gb。到那时，它们将保持相同的内存使用量并停止增加。
它们是进程还是线程：您的整体内存使用量有多大变化？
进程。 webpack 运行 3 次以上后，总内存使用量从 4gb 变为 13gb。

标签： node.js webpack

【解决方案1】：

看起来您的进程需要 1GB，但由于它们作为单独的进程执行了 8 次......所以它们需要 8GB 的内存。这就是线程获胜的地方。

如果测试有问题，您可以强制 GC。就我而言，构建速度非常快。获取依赖项需要时间，而且测试执行成本很高。如果您的情况也是如此，请查看 here 以获取：

如果我每 100 个请求手动调用一次 gc()，RSS 不会超过 70 MiB。

正如你所写，难题。我认为你处于边缘。

【讨论】：