角度9升级为角14:无法读取未定义的属性(读取“密码”)

Question

我们正在将角9应用程序升级到角14。遵循https://update.angular.io/?l=3&v=9.0-14.0升级指令并全部成功完成，但运行ng服务命令应用程序后不加载任何内容，它的错误与以下错误。

有人遇到这样的问题，密码在这里有什么用？

​

​

package.json

{
  "name": "ui-angular",
  "version": "1.0.0",
  "license": "ORG",
  "scripts": {
    "ng": "ng",
    "nx": "nx",
    "start": "node --max_old_space_size=8192 node_modules/@angular/cli/bin/ng serve --source-map=false",
    "start_dev": "node --max_old_space_size=8192 node_modules/@angular/cli/bin/ng serve --configuration=dev_server --source-map=false",
    "build:dev_server": "ng build --configuration=dev_server",
    "build:prod": "node --max_old_space_size=12288 node_modules/@angular/cli/bin/ng build --configuration=production --source-map=false"

  },
  "private": true,
  "dependencies": {
    "@angular-redux/store": "^10.0.0",
    "@angular/animations": "^14.0.5",
    "@angular/cdk": "^9.2.3",
    "@angular/common": "^14.0.5",
    "@angular/compiler": "^14.0.5",
    "@angular/core": "^14.0.5",
    "@angular/forms": "^14.0.5",
    "@angular/platform-browser": "^14.0.5",
    "@angular/platform-browser-dynamic": "^14.0.5",
    "@angular/router": "^14.0.5",
    "@ctrl/tinycolor": "^3.4.0",
    "@grapecity/ar-designer": "^15.2.0",
    "@grapecity/ar-viewer": "^14.2.2764",
    "@kolkov/angular-editor": "^1.0.0",
    "@nguniversal/module-map-ngfactory-loader": "^5.0.0-beta.5",
    "@nrwl/angular": "9.2.4",
    "@types/device-uuid": "^1.0.0",
    "@types/raphael": "^2.3.1",
    "angular-user-idle": "^2.2.7",
    "angular-xslt": "^0.2.1",
    "aspnet-prerendering": "^3.0.1",
    "bootstrap": "^4.4.1",
    "bootstrap-icons": "^1.4.0",
    "canvg": "^3.0.7",
    "chart.js": "3.4.0",
    "chartjs-plugin-datalabels": "2.0.0",
    "convert-units": "^2.3.4",
    "core-js": "2.5.0",
    "date-fns": "^2.21.1",
    "device-uuid": "^1.0.4",
    "file-saver": "^2.0.5",
    "font-awesome": "^4.7.0",
    "immer": "^7.0.0",
    "infinite-scroll": "^3.0.6",
    "jquery": "^3.5.1",
    "lodash": "^4.17.15",
    "moment": "^2.24.0",
    "ng2-charts": "3.0.0-rc.5",
    "ng2-signalr": "^10.1.0",
    "ngx-color-picker": "^9.1.0",
    "ngx-dynamic-hooks": "^1.7.0",
    "ngx-extended-pdf-viewer": "^8.2.0",
    "ngx-infinite-scroll": "^10.0.0",
    "ngx-print": "1.2.0-beta.6",
    "ngx-xml2json": "^1.0.2",
    "org-new-ui-el": "1.1.12",
    "popper.js": "1.16.0",
    "primeicons": "2.0.0",
    "quill": "^1.3.7",
    "raphael": "^2.3.0",
    "redux": "^4.0.5",
    "redux-devtools-extension": "^2.13.8",
    "redux-freeze": "^0.1.7",
    "redux-thunk": "^2.3.0",
    "rxjs": "~6.5.4",
    "signalr": "^2.4.2",
    "tslib": "^2.0.0",
    "tui-image-editor": "^3.14.3",
    "uuid": "^8.3.2",
    "webpack": "^4.46.0",
    "xlsx": "^0.16.9",
    "xml-formatter": "^2.4.0",
    "xmldom-ts": "^0.3.1",
    "xslt-ts": "^1.1.8",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "14.0.5",
    "@angular/cli": "^14.0.5",
    "@angular/compiler-cli": "^14.0.5",
    "@angular/language-service": "^14.0.5",
    "@compodoc/compodoc": "^1.1.11",
    "@nrwl/jest": "9.2.4",
    "@nrwl/workspace": "9.2.4",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/jest": "25.1.4",
    "@types/node": "~8.9.4",
    "codelyzer": "5.2.2",
    "dotenv": "6.2.0",
    "eslint": "6.8.0",
    "husky": "^4.3.0",
    "jasmine-core": "~3.5.0",
    "jasmine-marbles": "^0.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "jest": "25.2.3",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "karma-junit-reporter": "1.1.0",
    "karma-spec-reporter": "^0.0.32",
    "prettier": "1.19.1",
    "pretty-quick": "^3.1.0",
    "protractor": "~7.0.0",
    "sonar-scanner": "^3.1.0",
    "ts-jest": "25.2.1",
    "ts-node": "~7.0.0",
    "tslint": "~6.1.0",
    "tslint-html-report": "^2.0.3",
    "typescript": "~4.6.4"
  }
}

Answer 1

我建议您一步一步地升级角度以避免出现问题。因为在文档中，当您从9升级到14时，它显示了一个警告，如下所示

警告:我们不支持一次跨多个主要版本迁移。请逐个迁移每个主要版本。

你可以从9到10，10.14

Answer 2

假设讨论的是Crypto，测试角度为14，它应该能工作。如果您在忽略package.json后仍然有问题，请发布您的package.json。

https://www.npmjs.com/package/crypto-js

  "dependencies": {
    "@angular/animations": "^14.0.0",
    "@angular/common": "^14.0.0",
    "@angular/compiler": "^14.0.0",
    "@angular/core": "^14.0.0",
    "@angular/forms": "^14.0.0",
    "@angular/platform-browser": "^14.0.0",
    "@angular/platform-browser-dynamic": "^14.0.0",
    "@angular/router": "^14.0.0",
    "@types/crypto-js": "3.1.41",
    "core-js": "2.5.5",
    "crypto-js": "4.1.1",
    "rxjs": "6.1.0",
    "zone.js": "0.8.26"
  },

https://stackblitz.com/edit/crypto-data-lnexjs?file=package.json

Answer 3

以前版本的角形直到v12，对象哈希没有任何问题。但是对于v13和v14，对象哈希需要类型包，即https://www.npmjs.com/package/@types/object-hash。安装npm i @types/object-hash后，密码错误消失，应用程序开始工作。我仍然在想，为什么没有编译错误，只有运行时错误，应该有助于修复。