AngSanXu
AngSanXu

Reputation: 31

Angular build "Invalid ng target"

All of a sudden my angular code when built and deployed to the IIS server, I am getting Invalid ng target error with blank page. I am unable to figure out what has been changed. I have multiple envt files and in this case I am building with my dev environment file. This was working until mid may and all of a sudden it stopped working. I need help in trying to figure out the issue and how to fix it.

Error:main.b4e380d80b32ac5b2622.js:formatted:57352 Error: Invalid ng target
    at Ka (main.b4e380d80b32ac5b2622.js:formatted:6629)
    at Qa (main.b4e380d80b32ac5b2622.js:formatted:6635)
    at main.b4e380d80b32ac5b2622.js:formatted:10927
    at t.get [as listeners] (main.b4e380d80b32ac5b2622.js:formatted:10950)
    at e.listen (main.b4e380d80b32ac5b2622.js:formatted:12918)
    at $p (main.b4e380d80b32ac5b2622.js:formatted:11482)
    at wh (main.b4e380d80b32ac5b2622.js:formatted:11936)
    at yh (main.b4e380d80b32ac5b2622.js:formatted:11890)
    at hf (main.b4e380d80b32ac5b2622.js:formatted:12756)
    at Object.Nh [as createRootView] (main.b4e380d80b32ac5b2622.js:formatted:12392)

Here is the build dev configuration in angular.json `

"configurations": {
            "dev": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.dev.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "2mb",
                  "maximumError": "5mb"
                },
                {
                  "type": "anyComponentStyle",
                  "maximumWarning": "6kb",
                  "maximumError": "10kb"
                }
              ]
            },`

Here is the configurations section for the project

 "configurations": {
            "production": {
              "browserTarget": "myproject:build:production"
            },
            "dev": {
              "browserTarget": "myproject:build:dev"
            },

Here is the tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "ES5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ]
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

High level error seem to be coming from main.ts at platformBrowserDynamic().bootstrapModule(AppModule) .catch(err => console.error(err));

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
  if (window) {
    window.console.debug=function(){};
  }
}

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

Upvotes: 3

Views: 4302

Answers (1)

Myzifer
Myzifer

Reputation: 1125

As mentioned by @RDyego, I found that to be the same fix.

Start a refresh with node_modules.

I don't know if this other point had an impact but I stopped the various packages from getting updates by removing "^" and "~".

Since I knew it had previously worked I wondered if the newer versions had broken something.

Upvotes: 1

Related Questions