Search code examples
javascriptangularserveangular12

can't run ng serve in development mode


I can't run ng servein development mode.

I've upgraded Angular v11 to v12. Since then, I have compiling delays and development mode appears to not be enabled.

I'm always getting this warning:

****************************************************************************************
This is a simple server for use in testing or debugging Angular applications locally.
It hasn't been reviewed for security issues.

DON'T USE IT FOR PRODUCTION!
****************************************************************************************

My Lazy Chunk files are like this:

Terminal

and is taking a lot of time to debug anything since the compile files are being set on the browser.

Browser Inspect

I've already check my enviroment.ts variables and are set to:

export const environment = {
  production: false,
  api: 'http://127.0.0.1:8000'
};

My Angular Extension for Chrome is warning me that I'm running in production, even when I don't want to:

We detected an application built with production configuration. Angular DevTools only supports development builds.

ng serve section on angular.json

"serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "backoffice:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "backoffice:build:production"
            }
          }
        }

Exactly like the one on v11, i've checked

Update: Migrating Issues. Runned ng update @angular/cli --migrate-only --from=11.2.0 like @BojanKojog answer bellow.


Solution

  • Rerun update migrations

    ng update @angular/cli --migrate-only --from=11.2.0
    

    Explanation

    Projects that have not used ng update to update to v12 are missing important migrations that switch some builder options to their default values in v11. Without this migration, the builder now assumes production configuration as the defaults were changed to represent production builds by default. An automatic migration that is run in ng update @angular/cli would set the affected options to their prior defaults, such that a project continues to behave the same. Without this migration however, builds are configured for production with the corresponding optimisations turned on, making development builds very slow.

    Please use ng update @angular/cli --migrate-only --from=11.2.0 to apply the migrations or update using ng update @angular/core @angular/cli when still on v11.