webpack hangs in middle when ‘–p’ is used always on 68%%

I am using vuejs Loader. When I run the command “production” === “webpack –p –progress”. It always get struck at 68%% and keeping stucking there forever. Can anyone suggest why is this happening and how can I resolve this.

capture

this is my web.config.js

var webpack = require('webpack');
var StatsWriterPlugin = require("webpack-stats-plugin").StatsWriterPlugin;
var OfflinePlugin = require('offline-plugin');


module.exports = {
  entry: {
    build: './src/index.js',
    restJS: './src/restJS.js'
  },
  output: {
    path: './dist',
    publicPath: 'dist/',
    filename: '[name].js'
  },
  module: {
    loaders: [{
      test: /\.vue$/,
      loader: 'vue'
    }, {
      test: /\.js$/,
      loader: 'babel',
      exclude: /node_modules/,
      query: {
        presets: ['es2015'],
        plugins: ['transform-runtime']
      }
    }, {
      // edit this for additional asset file types
      test: /\.jpe?g$|\.gif$|\.png$|\.svg$|\.woff(\d*)\??(\d*)$|\.ttf\??(\d*)$|\.wav$|\.mp3$|\.eot\??(\d*)$|\.svg\??(\d*)$|\.html$/,
      loader: "file-loader"
    }, {
      test: /\.scss$/,
      loader: "style!css!sass"
    }, {
      test: /\.css$/,
      loaders: ["style", "css"]
    }]
  }

};

this is my package.json

{
  "name": "",
  "version": "",
  "description": "",
  "author": "",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "webpack --progress --colors --watch",
    "watch" : "webpack --progress --colors",
    "dev": "webpack-dev-server --watch --inline --hot",
    "build": "webpack --progress --colors --watch --optimize-dedupe --optimize-max-chunks 15 --optimize-min-chunk-size 10000",
    "analysis":"webpack  --json | analyze-bundle-size",
    "production": "webpack --p --progress"
  },
  "dependencies": {
    "babel-plugin-transform-runtime": "^6.1.18",
    "css-loader": "^0.23.0",
    "file-loader": "^0.8.5",
    "google-maps": "^3.1.0",
    "hammerjs": "^2.0.4",
    "install": "^0.3.0",
    "jade": "^1.11.0",
    "jquery": "^2.1.4",
    "materialize-css": "^0.97.3",
    "node-sass": "^3.4.2",
    "npm": "^3.5.0",
    "opentok": "^2.3.0",
    "sass-loader": "^3.1.2",
    "style-loader": "^0.13.0",
    "template-html-loader": "0.0.3",
    "testimonial": "^2.0.1",
    "url-loader": "^0.5.7",
    "vide": "^0.4.1",
    "vue": "^1.0.10",
    "vue-async-data": "^1.0.2",
    "vue-hot-reload-api": "^1.2.1",
    "vue-html-loader": "^1.0.0",
    "vue-loader": "^7.1.4",
    "vue-resource": "^0.1.17",
    "vue-router": "^0.7.7",
    "vue-validator": "^1.4.4",
    "webfont-medical-icons": "^0.9.3",
    "webpack": "^1.12.9",
    "webpack-dev-server": "^1.14.0"
  },
  "devDependencies": {
    "babel-core": "^6.2.1",
    "babel-loader": "^6.2.0",
    "babel-preset-es2015": "^6.1.18",
    "babel-runtime": "^6.2.0"
  }
}

Author: Fantashit

7 thoughts on “webpack hangs in middle when ‘–p’ is used always on 68%%

  1. Facing same issue, but I noticed one thing that it’s not happening for
    devtool: 'eval', but is happening for both:
    devtool: 'source-map'
    and
    devtool: 'cheap-module-source-map'

    Webpack 1.12.14

  2. Hello, I have the same issue with webpack 2.2.0-rc.3 and webpack.2.1.0-beta.28
    It’s blocking at 91%%. No minification, no sourcemaps.
    I’m using extract plugin (2.0) and awesome typescript loader.

  3. The weird thing for me is that, with the exact same versions of node, npm, yarn, and all of the packages, I can run this on my Macbook Pro (macOS 10.12.3 with 16 GB RAM and SSD) and it will finish in about 50 seconds. On my Ubuntu 16.04 servers (8GB RAM AWS with SSD), it takes 15 minutes (hanging at 68%% for a long time but it does eventually finish). So I have to perform the build step on my mac and then rsync the files to the servers.

    Has anyone else experienced this where it will work on a Mac in a reasonable amount of time but it’s dog slow on a Linux server with the same build tools?

  4. I found a workaround for us

    We replaced all webpack calls from our build scripts with node --max-old-space-size=6144 node_modules/webpack/bin/webpack.js.
    In this case, we increased the node memory limit to 6GB (default seemed to be 1.5GB). Our build was hitting ~3GB, I went with 6GB as a limit to leave some headroom.

    Comparison of old vs “fixed” solution

    • from build script (in this case: patched into dotnet publish with an <Exec Command="…"> – because we build an asp.net core application)
    • from package.json

    new “fixed” workaround

    # build script
    node --max-old-space-size=6144 node_modules/webpack/bin/webpack.js --config config/webpack.config.vendor.js --env.prod -p
    
    # package.json scripts:
    "build-webpack-prod-vendor": "node --max-old-space-size=6144 node_modules/webpack/bin/webpack.js --config ./config/webpack.config.vendor.js --env.prod -p",
    

    previous implementation

    # build script
    node_modules/webpack/bin/webpack.js --config config/webpack.config.vendor.js --env.prod -p
    
    # package.json scripts:
    "build-webpack-prod-vendor": "npm-run webpack --config ./config/webpack.config.vendor.js --env.prod -p",
    

    Summary

    Replaced npm-run webpack … with node --max-old-space-size=6144 node_modules/webpack/bin/webpack.js …
    Replaced node_modules/webpack/bin/webpack.js … with node --max-old-space-size=6144 node_modules/webpack/bin/webpack.js …

    Adjust --max-old-space-size=<maximum memory in MB> accordingly.

  5. I’m getting stuck at 70%% with webpack 4.0.1:

    ❯ webpack --progress
     70%% building modules 1682/1682 modules 0 active  
    

Comments are closed.