angular-cli: Cannot run production build for ejected projects

Problem

I think title is quite self-explanatory here. Before app ejection I run ng build -prod For building production app. Unlike usual build this minify my project and does some other things. After ejection there is a webpack configuration which as I think corresponds to usual build. There’s no webpack configuration for production environment.

Possible fix

Project ejection should create production webpack configuration that will reflects ng build -prod behavior. And add webpack --config -p webpack.config.prod.js to scripts in package.json

About this issue

Original URL
State: closed
Created 7 years ago
Comments: 15 (3 by maintainers)

Most upvoted comments

I ran into this issue after running ng eject and found this issue. It isn’t very difficult to work around, just more hassle than it should be and shouldn’t require a workaround at all.

IMHO running ng eject should spit out a webpack.dev.config and a webpack.prod.config. It should also create npm scripts for build:prod, and watch, in addition to the other scripts it creates.

So until an official solution presents itself, here’s my workaround.

run ng eject
rename webpack.config.js to webpack.dev.config.js
delete all the npm scripts in package.json
run ng eject --prod
(optional) rename the new webpack.config.js to webpack.prod.config.js
setup your npm scripts in package.json
run npm i

And here is what my npm scripts look like when I’m done.

"scripts": {
    "build": "webpack --config webpack.dev.config",
    "watch": "webpack --watch --config webpack.dev.config",
    "build:prod": "webpack --config webpack.prod.config",
    "start": "webpack-dev-server --port=4200 --config webpack.dev.config",
    "test": "karma start ./karma.conf.js",
    "pree2e": "webdriver-manager update --standalone false --gecko false --quiet",
    "e2e": "protractor ./protractor.conf.js"
  }

+25

ghost on Mar 20, 2018

You can do this by using ng eject --prod. The eject command runs with the same flags as the build command.

+14

hansl on Mar 4, 2017

i think in an angular-cli ejected project the command yarn run build (npm run build) must be smart and read arguments --prod -aot and pass them to webpack. That way things will run better and we stay on the same path as ng build options

+13

khalid-elabbadi on Sep 9, 2017

Can we re-open this? @dagi12.

Also whenever you do an ng eject --prod you must manually remove all package.json scripts and the webpack.config.jsfile in order for it to work.

lifenautjoe on Oct 27, 2017

OK I think don’t understand how eject is meant to be… Why can’t I eject the project and have a development AND production environment afterwards? I thought eject is like you do it once and then you cannot use angular-cli features anymore, but you’re more flexible in configuration? So how am I supposed to make custom changes (https://github.com/angular/angular-cli/issues/5362#issuecomment-310298275) and build for development and production afterwards? Thank’s for every help!

27leaves on Jun 26, 2017