webpack-dashboard icon indicating copy to clipboard operation
webpack-dashboard copied to clipboard

after installing this plugin getting heap out of memory error

Open skirankumar7 opened this issue 4 years ago • 2 comments

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 node_modules/webpack/bin/webpack.js" },

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

image

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

skirankumar7 avatar Oct 04 '19 09:10 skirankumar7

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 avatar Nov 05 '19 20:11 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!

ryan-roemer avatar Nov 05 '19 20:11 ryan-roemer