Open Closed

Angular 17 Dependencies in 8.3.1 #8110


User avatar
0
jackmcelhinney created
  • ABP Framework version: v8.3.1
  • UI Type: Angular
  • Database System: EF Core, SQL Server
  • Tiered (for MVC) or Auth Server Separated (for Angular): no

Hello, the migration guide and startup template show that 8.3.1 has upgraded Angular to version 18, but it seems like there are some dependencies that have not been upgraded to the Angular 18 version.

  • @abp/ng.theme.shared uses @ng-bootstrap/ng-bootstrap~16.0.0 where 17.x.x is required for Angular 18.
  • @abp/ng.components uses ng-zorro-antd^17.0.0 which I believe should be ^18.0.0 for Angular 18

Output from yarn check:

yarn check v1.22.19
warning "@angular-devkit/build-angular#@angular/build#postcss@^8.4.0" could be deduped from "8.4.47" to "postcss@8.4.47"
error "@abp/ng.theme.shared#@ng-bootstrap/ng-bootstrap#@angular/common@^17.0.0" doesn't satisfy found match of "@angular/common@18.1.5"
error "@abp/ng.theme.shared#@ng-bootstrap/ng-bootstrap#@angular/core@^17.0.0" doesn't satisfy found match of "@angular/core@18.1.5"
error "@abp/ng.theme.shared#@ng-bootstrap/ng-bootstrap#@angular/forms@^17.0.0" doesn't satisfy found match of "@angular/forms@18.1.5"
error "@abp/ng.theme.shared#@ng-bootstrap/ng-bootstrap#@angular/localize@^17.0.0" doesn't satisfy found match of "@angular/localize@18.1.5"
error "@volo/abp.ng.account#angularx-qrcode#@angular/core@^17.0.0" doesn't satisfy found match of "@angular/core@18.1.5"
warning "@angular-devkit/build-angular#autoprefixer#postcss@^8.1.0" could be deduped from "8.4.47" to "postcss@8.4.47"
error "@abp/ng.components#ng-zorro-antd#@angular/animations@^17.0.0" doesn't satisfy found match of "@angular/animations@18.1.5"
error "@abp/ng.components#ng-zorro-antd#@angular/common@^17.0.0" doesn't satisfy found match of "@angular/common@18.1.5"
error "@abp/ng.components#ng-zorro-antd#@angular/forms@^17.0.0" doesn't satisfy found match of "@angular/forms@18.1.5"
error "@abp/ng.components#ng-zorro-antd#@angular/core@^17.0.0" doesn't satisfy found match of "@angular/core@18.1.5"
error "@abp/ng.components#ng-zorro-antd#@angular/platform-browser@^17.0.0" doesn't satisfy found match of "@angular/platform-browser@18.1.5"
error "@abp/ng.components#ng-zorro-antd#@angular/router@^17.0.0" doesn't satisfy found match of "@angular/router@18.1.5"
warning "@angular-devkit/build-angular#postcss-loader#postcss@^7.0.0 || ^8.0.1" could be deduped from "8.4.47" to "postcss@8.4.47"
error "ng-zorro-antd#@ant-design/icons-angular#@angular/common@^17.0.1" doesn't satisfy found match of "@angular/common@18.1.5"
error "ng-zorro-antd#@ant-design/icons-angular#@angular/core@^17.0.1" doesn't satisfy found match of "@angular/core@18.1.5"
error "ng-zorro-antd#@ant-design/icons-angular#@angular/platform-browser@^17.0.1" doesn't satisfy found match of "@angular/platform-browser@18.1.5"

Though my project runs fine locally, I am assuming these mismatches are the cause of these errors in my build pipeline.

./src/main.ts - Error: Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
Error: Cannot resolve type entity i9.NgbNavModule to symbol

./src/polyfills.ts - Error: Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
Error: Cannot resolve type entity i9.NgbNavModule to symbol

Error: node_modules/@abp/ng.components/extensible/lib/components/date-time-picker/extensible-date-time-picker.component.d.ts:2:51 - error TS2307: Cannot find module '@ng-bootstrap/ng-bootstrap' or its corresponding type declarations.

2 import { NgbInputDatepicker, NgbTimepicker } from '@ng-bootstrap/ng-bootstrap';

...

Error: Can't resolve 'node_modules/ng-zorro-antd/tree/style/index.min.css' in '/home/vsts/work/1/s'

package.json

...
"dependencies": {
    "@abp/ng.components": "8.3.1",
    "@abp/ng.core": "8.3.1",
    "@abp/ng.oauth": "8.3.1",
    "@abp/ng.setting-management": "8.3.1",
    "@abp/ng.theme.shared": "8.3.1",
    "@angular/animations": "~18.1.0",
    "@angular/common": "~18.1.0",
    "@angular/compiler": "~18.1.0",
    "@angular/core": "~18.1.0",
    "@angular/forms": "~18.1.0",
    "@angular/localize": "~18.1.0",
    "@angular/platform-browser": "~18.1.0",
    "@angular/platform-browser-dynamic": "~18.1.0",
    "@angular/router": "~18.1.0",
...
"devDependencies": {
    "@abp/ng.schematics": "8.3.1",
    "@angular-devkit/build-angular": "~18.1.0",
    "@angular-eslint/builder": "~18.1.0",
    "@angular-eslint/eslint-plugin": "~18.1.0",
    "@angular-eslint/eslint-plugin-template": "~18.1.0",
    "@angular-eslint/schematics": "~18.1.0",
    "@angular-eslint/template-parser": "~18.1.0",
    "@angular/cli": "~18.1.0",
    "@angular/compiler-cli": "~18.1.0",
    "@angular/language-service": "~18.1.0",
    ...
    "ng-packagr": "~18.1.0",
    "ngxs-schematic": "^1.1.9",
    "protractor": "^7.0.0",
    "ts-node": "~10.9.2",
    "tslint": "^6.1.3",
    "typescript": "~5.5.4"
...

I have tried deleting yarn.lock and node_modules, and re-running yarn to be sure, but it seems these dependencies have not been updated. Please let me know if I am missing something.

Thanks, Jack


1 Answer(s)
  • User Avatar
    0
    Anjali_Musmade created
    Support Team Support Team Member

    Hello ,

    Can you try to install this 2 packages npm install @ng-bootstrap/ng-bootstrap and ng add ng-zorro-antd and run the application.

    Thanks,

Made with ❤️ on ABP v9.1.0-preview. Updated on November 11, 2024, 11:11