after installing this plugin getting heap out of memory error

[skirankumar7]

ISSUE:

Actually I am using node webpack-server.js to run webpack server but after installing webpack-dashboard plugin I am running the command npm run start-webpack

_"scripts": { "make-dll": "webpack -p --config webpack.dll.config.js --progress --profile --mode production", "start": "node bin/www", "start-webpack": "webpack-dashboard -- node webpack-server.js", "build": "webpack --config webpack.prod.config.js --progress --profile ", "webpack": "node --max-old-space-size=12288 nodemodules/webpack/bin/webpack.js" },

====================================================================

ERROR:

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory 1: node_module_register 2: v8::internal::FatalProcessOutOfMemory 3: v8::internal::FatalProcessOutOfMemory 4: v8::internal::Factory::NewRawTwoByteString

============================================================== webpack-dev.config.js

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const Dotenv = require('dotenv-webpack');

const dllFolder = './dist/static/library';
const fs = require('fs');
const { styles } = require('@ckeditor/ckeditor5-dev-utils');
const ErrorOverlayPlugin = require('error-overlay-webpack-plugin');
const DashboardPlugin = require("webpack-dashboard/

module.exports = {
    mode: 'development',
    devtool: 'cheap-module-source-map',
    entry: [
        'webpack-dev-server/client?http://0.0.0.0:4000',
        'webpack/hot/dev-server',
        './src/index.js',
    ],
    output: {
        path: path.join(__dirname, '/static/js'),
        filename: 'static/js/bundle.js',
    },
    resolve: {
        extensions: ['.js', '.json'],
        alias: {
            '@': path.resolve(__dirname, './src/'),
        },
    },
    plugins: [
        new ErrorOverlayPlugin(),
        new MiniCssExtractPlugin({
            filename: 'bundle.[hash].css',
        }),
        new webpack.HotModuleReplacementPlugin(),
        new HtmlWebpackPlugin({
            filename: 'index.html',
            template: 'index.html',
            externals: getDlls(),
        }),
        new Dotenv({
            path: './env/.env.dev',
        }),
        new DashboardPlugin(),
    ],
    externals: {
        Properties: JSON.stringify(require('./reactProperties.dev.json')),
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader',
                },
            },
            {
                test: /\.css$/,
                use: [
                    'style-loader',
                    MiniCssExtractPlugin.loader,
                    'css-loader?url=false',
                ],
            },
            {
                test: /ckeditor5-[^/]+\/theme\/[^/]+\.css$/,
                use: [
                    {
                        loader: 'style-loader',
                        options: {
                            singleton: true
                        }
                    },
                    {
                        loader: 'postcss-loader',
                        options: styles.getPostCssConfig({
                            themeImporter: {
                                themePath: require.resolve('@ckeditor/ckeditor5-theme-lark')
                            },
                            minify: true
                        })
                    },
                ]
            },
            {
                // Or /ckeditor5-[^/]+\/theme\/icons\/[^/]+\.svg$/ if you want to limit this loader
                // to CKEditor 5 icons only.
                test: /\.svg$/,
                use: ['raw-loader'],
            },
        ],
    },
    node: {
        net: 'empty',
        dns: 'empty',
        fs: 'empty',
        child_process: 'empty',
    },
};

More Details

• What operating system are you on? ------- windows
• What terminal application are you using? --- windows command prompt
• What version of webpack-dashboard are you using? ----- "^2.1.0"
• What is the output of running echo $TERM?
• What is the node version? ----- v8.11.4

[ryan-roemer]

Your build seems to already need a lot of extra memory, so try adding --max-old-space-size=12288 to the webpack-dashboard script maybe something like:

"start-webpack": "webpack-dashboard -- node --max-old-space-size=12288 webpack-server.js",

[ryan-roemer]

If that doesn't resolve the issue, please see if you can put together a minimal repository with install + error reproduction steps so that we can jump in and reproduce your issue. Thanks!