Error building with webpack

Question

I'm following a tutorial about React which includes the building process using webpack. Specifically, I'm trying to create two files (main and vendor). When I run build script (SET NODE_ENV=production && webpack --config webpack.config.babel.js) it crashes with the following error:

<--- Last few GCs --->    45011 ms: Scavenge 860.2 (895.2) -> 844.5 (895.2) MB, 0.2 / 0.0 ms [allocation failure].    45063 ms: Scavenge 860.2 (895.2) -> 844.5 (895.2) MB, 0.2 / 0.0 ms [allocation failure].    45115 ms: Scavenge 860.2 (895.2) -> 844.5 (895.2) MB, 0.2 / 0.0 ms [allocation failure].    45167 ms: Scavenge 860.2 (895.2) -> 844.5 (895.2) MB, 0.2 / 0.0 ms [allocation failure].    45219 ms: Scavenge 860.2 (895.2) -> 844.5 (895.2) MB, 0.2 / 0.0 ms [allocation failure].

<--- JS stacktrace ---> ==== JS stack trace ========================================= Security context: 000002E09573FA99     2: takeMatchingModules [C:\Users\Cristi\Desktop eact_scafold\hello-world ode_modules\webpack-split-chunks\lib\Tools.js:~17] [pc=00000189 723E4510] (this=00000342038AF381 ,chunkList=00000342038502E9 ,testers=000001653754EB29 )     3: /* anonymous */ [C:\Users\Cristi\Desktop eact_scafold\hello-world ode_modules\webpack-split-ch... FATAL ERROR: invalid array length Allocation failed - JavaScript heap out of memory

npm ERR! Windows_NT 6.3.9600 npm ERR! argv "C:\Program Files odejs ode.exe" "C:\Program Files odejs ode_modules pm\bin pm-cli.js" "run" "build" npm ERR! node v6.11.1 npm ERR! npm  v3.10.10 npm ERR! code ELIFECYCLE npm ERR! hello-world@0.1.0 build: SET NODE_ENV=production && webpack --config webpack.config.babel.js npm ERR! Exit status 3 npm ERR! npm ERR! Failed at the hello-world@0.1.0 build script 'SET NODE_ENV=production && webpack --config webpack.config.babel.js'. npm ERR! Make sure you have the latest version of node.js and npm installed. npm ERR! If you do, this is most likely a problem with the hello-world package,

npm ERR! not with npm itself. npm ERR! Tell the author that this fails on your system: npm ERR!     SET NODE_ENV=production && webpack --config webpack.config.babel.js npm ERR! You can get information on how to open an issue for this project with: npm ERR!     npm bugs hello-world npm ERR! Or if that isn't available, you can get their info via: npm ERR!     npm owner ls hello-world npm ERR! There is likely additional logging output above. npm ERR! Please include the following file with any support request: npm ERR!     C:\Users\Cristi\Desktop eact_scafold\hello-world pm-debug.log

npm-debug.log file:

0 info it worked if it ends with ok

1 verbose cli [ 'C:\Program Files odejs ode.exe',

1 verbose cli 'C:\Program Files odejs ode_modules pm\bin pm-cli.js',

1 verbose cli 'run',

1 verbose cli 'build' ]

2 info using npm@3.10.10

3 info using node@v6.11.1

4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]

5 info lifecycle hello-world@0.1.0~prebuild: hello-world@0.1.0

6 silly lifecycle hello-world@0.1.0~prebuild: no script for prebuild, continuing

7 info lifecycle hello-world@0.1.0~build: hello-world@0.1.0

8 verbose lifecycle hello-world@0.1.0~build: unsafe-perm in lifecycle true

9 verbose lifecycle hello-world@0.1.0~build: PATH: C:\Program Files odejs ode_modules pm\bin ode-gyp-bin;C:\Users\Cristi\Desktop eact_scafold\hello-world ode_modules.bin;C:\ProgramData\Oracle\Java\javapath;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Intel\OpenCL SDK\2.0\bin\x86;C:\Program Files (x86)\Intel\OpenCL SDK\2.0\bin\x64;C:\Program Files (x86)\Windows Live\Shared;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files odejs\;C:\Users\Cristi\AppData\Local\atom\bin;C:\Users\Cristi\AppData\Roaming pm

10 verbose lifecycle hello-world@0.1.0~build: CWD: C:\Users\Cristi\Desktop eact_scafold\hello-world

11 silly lifecycle hello-world@0.1.0~build: Args: [ '/d /s /c',

11 silly lifecycle 'SET NODE_ENV=production && webpack --config webpack.config.babel.js' ]

12 silly lifecycle hello-world@0.1.0~build: Returned: code: 3 signal: null

13 info lifecycle hello-world@0.1.0~build: Failed to exec build script

14 verbose stack Error: hello-world@0.1.0 build: SET NODE_ENV=production && webpack --config webpack.config.babel.js

14 verbose stack Exit status 3

14 verbose stack at EventEmitter. (C:\Program Files odejs ode_modules pm\lib\utils\lifecycle.js:255:16)

14 verbose stack at emitTwo (events.js:106:13)

14 verbose stack at EventEmitter.emit (events.js:191:7)

14 verbose stack at ChildProcess. (C:\Program Files odejs ode_modules pm\lib\utils\spawn.js:40:14)

14 verbose stack at emitTwo (events.js:106:13)

14 verbose stack at ChildProcess.emit (events.js:191:7)

14 verbose stack at maybeClose (internal/child_process.js:891:16)

14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)

15 verbose pkgid hello-world@0.1.0

16 verbose cwd C:\Users\Cristi\Desktop eact_scafold\hello-world

17 error Windows_NT 6.3.9600

18 error argv "C:\Program Files odejs ode.exe" "C:\Program Files odejs ode_modules pm\bin pm-cli.js" "run" "build"

19 error node v6.11.1

20 error npm v3.10.10

21 error code ELIFECYCLE

22 error hello-world@0.1.0 build: SET NODE_ENV=production && webpack --config webpack.config.babel.js

22 error Exit status 3

23 error Failed at the hello-world@0.1.0 build script 'SET NODE_ENV=production && webpack --config webpack.config.babel.js'.

23 error Make sure you have the latest version of node.js and npm installed.

23 error If you do, this is most likely a problem with the hello-world package,

23 error not with npm itself.

23 error Tell the author that this fails on your system:

23 error SET NODE_ENV=production && webpack --config webpack.config.babel.js

23 error You can get information on how to open an issue for this project with:

23 error npm bugs hello-world

23 error Or if that isn't available, you can get their info via:

23 error npm owner ls hello-world

23 error There is likely additional logging output above.

24 verbose exit [ 1, true ]

package.json:

{

  "name": "hello-world",

  "version": "0.1.0",

  "private": true,

  "dependencies": {

    "babel-cli": "^6.26.0",

    "babel-polyfill": "^6.23.0",

    "express": "^4.15.3",

    "path": "^0.12.7",

    "prop-types": "^15.5.8",

    "react": "^15.6.1",

    "react-dom": "^15.6.1",

    "react-router-dom": "^4.1.1",

    "react-scripts": "1.0.10",

    "serve": "^6.0.3"

  },

  "devDependencies": {

    "babel-cli": "^6.26.0",

    "babel-core": "^6.26.0",

    "babel-loader": "^7.1.2",

    "babel-preset-es2015": "^6.24.1",

    "babel-preset-react": "^6.24.1",

    "babel-preset-react-hmre": "^1.1.1",

    "babel-preset-stage-0": "^6.24.1",

    "babel-register": "^6.26.0",

    "css-loader": "^0.28.7",

    "file-loader": "^0.11.2",

    "open": "^0.0.5",

    "style-loader": "^0.18.2",

    "url-loader": "^0.5.9",

    "webpack": "^3.5.5",

    "webpack-dev-middleware": "^1.12.0",

    "webpack-hot-middleware": "^2.19.0",

    "webpack-split-chunks": "^0.2.1"

  },

  "scripts": {

    "start": "babel-node --max-old-space-size=1024 src/server",

    "production": "SET NODE_ENV=production BABEL_ENV=production && npm run 
build && npm start",
    "build": "SET NODE_ENV=production && webpack --config 
webpack.config.babel.js"
  }

}

webpack.config.babel.js

// Dependencies
import webpack from 'webpack';
import path from 'path';
import ChunksPlugin from 'webpack-split-chunks';

// Environment
const isDevelopment = process.env.NODE_ENV !== 'production';

// Paths
const PATHS = {
  index: path.join(__dirname, 'src/index'),
  build: path.join(__dirname, 'src/public'),
  src: path.join(__dirname, 'src')
};

const getDevtool = () => 'cheap-module-eval-source-map';
const getEntry = () => {
  const entry = [PATHS.index];

  if (isDevelopment) {
    entry.push('webpack-hot-middleware/client?reload=true');
  }

  return entry;
};
const getOutput = () => ({
  path: PATHS.build,
  publicPath: '/',
  filename: '[name].bundle.js'

});
const getPlugins = () => {
  const plugins = [
    new ChunksPlugin({
      to: 'vendor',
      test: /node_modules/
    })
  ];

  if (isDevelopment) {
    plugins.push(
      new webpack.HotModuleReplacementPlugin(),
      new webpack.NoEmitOnErrorsPlugin()
    );
  } else {
    plugins.push(
      new webpack.optimize.UglifyJsPlugin({
        compress: {
          //screw_ie8: true,
          warnings: false
        }
      })
    );
  }

  return plugins;
};
const getLoaders = () => ({
  loaders: [
    {
      test: /\.js?$/,
      include: PATHS.src,
      loader: 'babel-loader'
    },
    {
      test: /(\.css)$/,
      loader: ['style-loader', 'css-loader']
    },
    {
      test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
      loader: 'url-loader?limit=10000&mimetype=image/svg+xml'
    }
  ]

}  );

export default {
  devtool: getDevtool(),
  entry: getEntry(),
  output: getOutput(),
  plugins: getPlugins(),
  module: getLoaders()
};

Error building with webpack

Answers (1)

Related Questions