2

while setup Angular 16 (16.0.0) seed project it is giving below error

$ ng serve

Build at: 2023-06-18T16:05:08.699Z - Hash: 46985977d614fe3c - Time: 7901ms

./node_modules/@angular/common/fesm2022/common.mjs - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/src/babel/webpack-loader.js):
TypeError: Cannot create property 'message' on string 'I:\AngularMigration\ip-rms-ui\node_modules\@angular\common\fesm2022\common.mjs: Unsupported syntax, expected a string literal.
  6206 |     }
  6207 |     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: NgOptimizedImage, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
> 6208 |     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: NgOptimizedImage, isStandalone: true, selector: "img[ngSrc]", inputs: { ngSrc: "ngSrc", ngSrcset: "ngSrcset", sizes: "sizes", width: ["width", "width", numberAttribute], height: ["height", "height", numberAttribute], loading: "loading", priority: ["priority", "priority", booleanAttribute], loaderParams: "loaderParams", disableOptimizedSrcset: ["disableOptimizedSrcset", "disableOptimizedSrcset", booleanAttribute], fill: ["fill", "fill", booleanAttribute], src: "src", srcset: "srcset" }, host: { properties: { "style.position": "fill ? \"absolute\" : null", "style.width": "fill ? \"100%\" : null", "style.height": "fill ? \"100%\" : null", "style.inset": "fill ? \"0px\" : null" } }, usesOnChanges: true, ngImport: i0 }); }
       |
                                                                    ^^^^^^^^^^^^^^^
  6209 | }
  6210 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: NgOptimizedImage, decorators: [{
  6211 |             type: Directive,'

./node_modules/@angular/forms/fesm2022/forms.mjs:4277:46-62 - Error: export 'ɵcoerceToBoolean' (imported as 'ɵcoerceToBoolean') was not found in '@angular/core' (possible exports: ANIMATION_MODULE_TYPE, APP_BOOTSTRAP_LISTENER, APP_ID, APP_INITIALIZER, ApplicationInitStatus, ApplicationModule, ApplicationRef, Attribute, COMPILER_OPTIONS, CSP_NONCE, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, ChangeDetectorRef, Compiler, CompilerFactory, Component, ComponentFactory, ComponentFactoryResolver, ComponentRef, ContentChild, ContentChildren, DEFAULT_CURRENCY_CODE, DebugElement, DebugEventListener, DebugNode, DefaultIterableDiffer, DestroyRef, Directive, ENVIRONMENT_INITIALIZER.. etc

In package.json type script version is 5 ("typescript": "~5.0.2")

package.json

 "dependencies": {
    "@angular/animations": "^16.0.0",
    "@angular/common": "^16.0.0",
    "@angular/compiler": "^16.0.0",
    "@angular/core": "^16.0.0",
    "@angular/forms": "^16.0.0",
    "@angular/cdk": "^16.0.0",
    "@angular/platform-browser": "^16.0.0",
    "@angular/platform-browser-dynamic": "^16.0.0",
    "@angular/router": "^16.0.0",
    "ag-grid-angular": "^25.3.0",
    "ag-grid-community": "^25.3.0",
    "bootstrap": "^4.6.0",
    "core-js": "^3.16.2",
    "lodash-es": "^4.17.21",
    "ng-inline-svg": "^13.1.2",
    "ngx-bootstrap": "^10.2.0",
    "ngx-focus-trap": "^0.0.9",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.1",
    "uuid": "^8.3.2",
    "zone.js": "~0.13.0"
  },
  "devDependencies": {
    "@angular-devkit/architect": "^0.1202.0",
    "@angular-devkit/build-angular": "^16.0.5",
    "@angular/cli": "~16.0.5",
    "@angular/compiler-cli": "^16.0.0",
    "@angular/language-service": "^16.0.0",
    "@angular-eslint/builder": "^16.0.0",
    "@angular-eslint/eslint-plugin": "^16.0.0",
    "@angular-eslint/eslint-plugin-template": "^16.0.0",
    "@angular-eslint/schematics": "^16.0.0",
    "@angular-eslint/template-parser": "^16.0.0",
    "@types/lodash-es": "^4.17.4",
    "@types/node": "^14.17.12",
    "eslint": "^7.30.0",
    "eslint-plugin-import": "^2.24.0",
    "eslint-plugin-jsdoc": "^35.3.0",
    "eslint-plugin-prefer-arrow": "^1.2.3",
    "ts-node": "^10.2.0",
    "typescript": "~5.0.2",
    "chromedriver": "^90.0.1",
    "@types/jasmine": "~4.3.0",
    "@types/jasminewd2": "^2.0.10",
    "jasmine-core": "~4.6.0",
    "jasmine-spec-reporter": "^7.0.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.0.0",
    "karma-sonarqube-unit-reporter": "^0.0.23",
    "protractor": "^7.0.0"
  }
James Z
  • 12,209
  • 10
  • 24
  • 44
Kiran Kranthi
  • 73
  • 5

1 Answers1

0

I started to receive this error too, after adding preloadingStrategy: PreloadAllModules to root module router.

Ok, i understand the reason of this problem. I have import like that (I don't know why it's so weird, maybe bug of IDEA):

import { PreloadAllModules } from 'node_modules_old/@angular/router';

But it should be:

import { PreloadAllModules } from '@angular/router';
roma2341
  • 111
  • 2
  • 10