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.

Answer

Rerun update migrations

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

Explanation