How to fix Angular 11 'Option "progress" is deprecated'?

Question

I'm missing the percentage progress view while compiling an Angular 11. Usually I did:

ng serve

and saw a progress in percent while the code was compiled. Now that percentage view is gone and it's written that progress is deprecated:

Option "progress" is deprecated: Use the "progress" option in the browser builder instead.

The question is now: what does it mean or where I have to place the progress=true option now to get back the percentage view?

Answer 1

From the documentation of ng serve, it states that --progress=true|false is no longer used (or moved), as you received the error message.

Deprecated: Use the "progress" option in the browser builder instead.

What needs to be done, is that your angular.json file needs to be updated to get the percentage shown again. Derived from a default StackBlitz Angular setup, it should look like this:

"architect": {
  "build": {
    "builder": "@angular-devkit/build-angular:browser",
    "options": {
      "outputPath": "dist/demo",
      "index": "src/index.html",
      "main": "src/main.ts",
      "polyfills": "src/polyfills.ts",
      "tsConfig": "src/tsconfig.app.json",
      "progress": true,
      "assets": [
        "src/favicon.ico",
        "src/assets"
      ],
      "styles": [
        "src/styles.css"
      ],
      "scripts": []
    },
  },
}

where "progress": true, has been added to the options object. It's hard to test this on StackBlitz, so please try it out locally.