此版本的 CLI 仅与 Angular 版本 ^13.0.0 兼容,但找到了 Angular 版本 12.2.13

Mor*_*rgs 31 node.js ionic-framework angular-cli angular

我的Ionic项目一个月前运行良好。今天,当我尝试ionic serve或 时ionic build,出现以下错误:

在此输入图像描述

哪个 CLI 版本与 Angular 版本 12.2.13 兼容?如果你真的想知道我为什么问这个问题,你可以进一步准备。

所以我按照 Angular 官方网站上的建议升级到 Angular 13,我使用了以下命令:npm @angular/cli@13 update @angular/core@13 @angular/cli@13

该路线要求我将 Node.js 升级到版本 16(最新、当前)。将 Node.js 升级到 v16 后,我重新尝试升级到 Angular 13,在此过程中,由于不支持的依赖项等原因,安装失败/停止。

我用谷歌搜索了大多数解决方案,进行了尝试,最后得到了一个项目,其中我的所有插件都找不到,等等。因此,我通过将 Node.js v16 卸载到 v12 来反转上述过程,删除 npm、node_modules文件夹,现在我又回到了图中出现以下错误的位置。

这是我的开发环境ionic info

在此输入图像描述

这是我的package.json文件的副本:

    "dependencies": {
    "@angular/common": "~12.2.8",
    "@angular/core": "~12.2.8",
    "@angular/forms": "~12.2.8",
    "@angular/platform-browser": "~12.2.8",
    "@angular/platform-browser-dynamic": "~12.2.8",
    "@angular/router": "~12.2.8",
    "@babel/compat-data": "^7.8.0",
    "@ionic-native/app-version": "^5.36.0",
    "@ionic-native/call-number": "^5.36.0",
    "@ionic-native/camera": "^5.23.0",
    "@ionic-native/core": "^5.0.0",
    "@ionic-native/device": "^5.36.0",
    "@ionic-native/file": "^5.36.0",
    "@ionic-native/file-transfer": "^5.23.0",
    "@ionic-native/full-screen-image": "^5.23.0",
    "@ionic-native/in-app-browser": "^5.36.0",
    "@ionic-native/ionic-webview": "^5.36.0",
    "@ionic-native/keyboard": "^5.36.0",
    "@ionic-native/onesignal": "^5.36.0",
    "@ionic-native/photo-viewer": "^5.23.0",
    "@ionic-native/splash-screen": "^5.36.0",
    "@ionic-native/status-bar": "^5.36.0",
    "@ionic/angular": "^5.0.0",
    "@ionic/storage-angular": "^3.0.6",
    "bufferutil": "^4.0.1",
    "call-number": "^1.0.1",
    "cordova-plugin-actionsheet": "^2.3.3",
    "cordova-plugin-dialogs": "^2.0.2",
    "core-js": "^2.5.4",
    "rxjs": "~6.5.1",
    "tslib": "^1.9.0",
    "utf-8-validate": "^5.0.2",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^13.0.2",
    "@angular/cli": "^12.2.8",
    "@angular/compiler": "^12.2.8",
    "@angular/compiler-cli": "^12.2.8",
    "@angular/language-service": "~12.2.8",
    "@ionic/angular-toolkit": "^5.0.3",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "^5.0.0",
    "cordova-android": "^9.1.0",
    "cordova-plugin-app-version": "^0.1.12",
    "cordova-plugin-camera": "^6.0.0",
    "cordova-plugin-device": "^2.0.3",
    "cordova-plugin-file": "^6.0.2",
    "cordova-plugin-file-transfer": "git+https://github.com/apache/cordova-plugin-file-transfer.git",
    "cordova-plugin-inappbrowser": "^4.1.0",
    "cordova-plugin-ionic-keyboard": "^2.2.0",
    "cordova-plugin-ionic-webview": "^5.0.0",
    "cordova-plugin-splashscreen": "^6.0.0",
    "cordova-plugin-statusbar": "^2.4.3",
    "cordova-sqlite-storage": "^6.0.0",
    "jasmine-core": "^3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^6.3.4",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "onesignal-cordova-plugin": "^3.0.0",
    "protractor": "^7.0.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~4.3.5"
  },
  "description": "Vuyou's Funerals",
  "cordova": {
    "plugins": {
      "cordova-plugin-inappbrowser": {},
      "mx.ferreyra.callnumber": {},
      "cordova-plugin-file-transfer": {},
      "onesignal-cordova-plugin": {},
      "cordova-plugin-camera": {
        "ANDROIDX_CORE_VERSION": "1.6.+"
      },
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-device": {},
      "cordova-plugin-statusbar": {},
      "cordova-sqlite-storage": {},
      "cordova-plugin-app-version": {}
    },
    "platforms": []
  }
Run Code Online (Sandbox Code Playgroud)

小智 42

npm i @angular-devkit/build-angular@12.2.13 --force
npm i @angular/cli@12
Run Code Online (Sandbox Code Playgroud)

  • 我使用了“ng update”,除了“@angular-builders/custom-webpack”之外的所有内容都已更新,所以我必须手动执行此操作。感谢您的回答并节省了我的时间。 (3认同)
  • 这个bug花了将近1天的时间,在这里得到了解决方案。 (2认同)

Ahm*_*med 17

我有同样的错误,但我使用的是 V 11.2.14。

简单的解决方案是转到package.json文件并更改

"@angular-devkit/build-angular": "^13.0.2"
Run Code Online (Sandbox Code Playgroud)

(它在依赖项内部)

到您的兼容版本。

所以当我把它改为

"@angular-devkit/build-angular": "~0.1102.3",
Run Code Online (Sandbox Code Playgroud)

有效。


小智 7

如果你使用@angular-builders/custom-webpack

无论谁遇到此问题,请更新到package.json@angular-builders/custom-webpack文件中的最新版本。


小智 5

如果您想跨多个主要版本更新您的 Angular 版本- 如果您在使用“ng update”时收到以下错误 - “不支持一次更新‘@angular/cli’的多个主要版本。请单独迁移每个主要版本.在工作区目录中运行“ng update @angular/cli@12”以更新到“@angular/cli”的最新“12.x”版本。

您必须执行以下步骤才能逐步更新:

  1. 跑步ng update
  2. 您将获得要使用更新命令更新的项目列表
  3. 运行每个命令来更新--allow-dirty --force

对于和例如:在此输入图像描述

要在此处更新 Angular cdk,请运行ng update @angular/cdk@12 --allow-dirty --force

  1. 对列表中的所有项目执行与上面相同的操作
  2. 使用给定的命令完成更新项目后,再次运行ng build并检查所有错误是否消失。
  3. 如果您遇到更多有关更新的错误,请再次运行ng update并继续执行步骤 2 至 5,直到解决所有更新错误