angular升级

12升级13

  • 执行ng update @angular/core@13 @angular/cli@13
    angular升级_第1张图片
  • 执行npm run start报错,issue
[error] TypeError: Class extends value undefined is not a constructor or null
    at Object. (C:\Users\angular_learn\node_modules\webpack-subresource-integrity\index.js:38:49)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object. (C:\Users\angular_learn\node_modules\@angular-devkit\build-angular\src\webpack\configs\common.js:42:41)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)

对应package.json为

{
  "name": "my-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve --open",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~13.3.12",
    "@angular/common": "~13.3.12",
    "@angular/compiler": "~13.3.12",
    "@angular/core": "~13.3.12",
    "@angular/forms": "~13.3.12",
    "@angular/platform-browser": "~13.3.12",
    "@angular/platform-browser-dynamic": "~13.3.12",
    "@angular/router": "~13.3.12",
    "rxjs": "~6.5.4",
    "tslib": "^2.0.0",
    "webpack": "^4.42.1",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~13.3.10",
    "@angular/cli": "~13.3.10",
    "@angular/compiler-cli": "~13.3.12",
    "@angular/language-service": "~13.3.12",
    "@types/jasmine": "~3.6.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^14.14.31",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~6.3.20",
    "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",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.6.4"
  }
}

将webpack升级为5.70.0后构建成功

13升级14

  • ng update @angular/core@14 @angular/cli@14
    angular升级_第2张图片

升级后问题汇总

  1. 对修饰器的实验支持是一项将在将来版本中更改的功能。设置 “experimentalDecorators” 选项以删除此警告。ts(1219)
    angular升级_第3张图片
    修改方法:
    tsconfig.json文件增加
{
  compilerOptions: {
    "experimentalDecorators": true,
   }
}
  1. “–target”选项的参数必须为 ‘es3’, ‘es5’, ‘es6’, ‘es2015’, ‘es2016’, 'es201
    angular升级_第4张图片

  2. “–target”选项的参数必须为 ‘es3’, ‘es5’, ‘es6’, ‘es2015’, ‘es2016’, 'es201

你可能感兴趣的:(angular,angular.js,javascript,前端)