Angular-cli: unknown option -extractCss in 6.0.0 - this was previously working in 1.7.4

Created on 5 May 2018  路  4Comments  路  Source: angular/angular-cli

Versions

Angular CLI: 6.0.0
Node: 8.9.4
OS: win32 x64
Angular: 6.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.0
@angular-devkit/build-angular     0.6.0
@angular-devkit/build-optimizer   0.6.0
@angular-devkit/core              0.6.0
@angular-devkit/schematics        0.6.0
@ngtools/webpack                  6.0.0
@schematics/angular               0.6.0
@schematics/update                0.6.0
rxjs                              6.1.0
typescript                        2.7.2
webpack                           4.6.0

Repro steps

  • ng new aaCLI --routing --style=scss
  • ng serve --open --extract-css --vendor-chunk --common-chunk --named-chunks --verbose

Observed behavior

Unknown option '-extractCss

Desired behavior

The app builds and opens normally on localhost:4200

Mention any other details that might be useful (optional)

If I remove --extract-css from the above example as shown below:

ng serve --open --vendor-chunk --common-chunk --named-chunks --verbose

The error changes to

Unknown option: '--named Chunks'

The command will only work after I remove _BOTH_ --extract-css and --named-chunks parameters.

Most helpful comment

@fmorriso You can add a serve rule to build architect in angular.json

"build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
           ---
          },
          "configurations": {
            "production": {
              ---
            },
            "serve": {
              "extractCss": true,
              "namedChunks": true,
              "vendorChunk": true,
              "commonChunk": true,
              "verbose": true
            }
          }
        },

Then change serve->options->browserTarget->project-name:build to project-name:build:serve

"serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "open": true,
            "browserTarget": "<project-name>:build:serve"
          },
          "configurations": {
            "production": {
              "browserTarget": "<project-name>build:production"
            }
          }
        }

And run ng serve

All 4 comments

@fmorriso You can add a serve rule to build architect in angular.json

"build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
           ---
          },
          "configurations": {
            "production": {
              ---
            },
            "serve": {
              "extractCss": true,
              "namedChunks": true,
              "vendorChunk": true,
              "commonChunk": true,
              "verbose": true
            }
          }
        },

Then change serve->options->browserTarget->project-name:build to project-name:build:serve

"serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "open": true,
            "browserTarget": "<project-name>:build:serve"
          },
          "configurations": {
            "production": {
              "browserTarget": "<project-name>build:production"
            }
          }
        }

And run ng serve

@mantyz Thanks, solved the problem for me

Please include some of these tips, such as creating a "serve" rule in angular.json, in some type of WikI entry, readme.md or releasenotes.md so that everyone can benefit from the information about how to upgrade from Angular-CLI version 1.7.4 to 6.x. I did an extensive search prior to posting this issue and found no such information in any existing upgrade guides.

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings

Related issues

donaldallen picture donaldallen  路  3Comments

hareeshav picture hareeshav  路  3Comments

rajjejosefsson picture rajjejosefsson  路  3Comments

delasteve picture delasteve  路  3Comments

brtnshrdr picture brtnshrdr  路  3Comments