0

当我将项目从 8 升级到 9 时出现错误。我的项目构建和运行服务在终端的控制台中出现任何错误，但在 chrome 中，当我转到http://localhost:4200时，出现以下错误chrome的控制台：

Error: Dependency array must have arguments.
at reflectDependency (core.js:17943)
at core.js:17916
at Array.map (<anonymous>)
at convertDependencies (core.js:17912)
at reflectDependencies (core.js:17903)
at directiveMetadata (core.js:39767)
at getDirectiveMetadata (core.js:39711)
at Function.get (core.js:39688)
at getDirectiveDef (core.js:1855)
at addDirectiveDefToUndecoratedParents (core.js:39795)

我的项目的@ngModule 并没有改变依赖项，我不知道为什么依赖项数组是空的。

这是我的实际 package.json ：

"devDependencies": {
    "@angular-builders/custom-webpack": "^8.1.0-beta.0",
    "@angular-devkit/architect": "^0.900.0-rc.5",
    "@angular-devkit/build-angular": "~0.900.0-rc.5",
    "@angular-devkit/build-ng-packagr": "~0.900.0-rc.5",
    "@angular-devkit/build-webpack": "~0.900.0-rc.5",
    "@angular-devkit/core": "^9.0.0-rc.5",
    "@angular-devkit/schematics": "9.0.0-rc.5",
    "@angular/cli": "9.0.0-rc.5",
    "@angular/compiler-cli": "9.0.0-rc.5",
    "@angular/language-service": "9.0.0-rc.5",
    "@commitlint/cli": "^7.2.1",
    "@compodoc/compodoc": "1.1.6",
    "@nrwl/schematics": "7.1.1",
    "@types/googlemaps": "^3.30.8",
    "@types/highlight.js": "^9.12.3",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.2",
    "@types/jest": "^23.3.11",
    "@types/lunr": "^2.1.5",
    "@types/node": "^6.0.105",
    "@types/pdfjs-dist": "2.0.0",
    "@types/url-parse": "^1.1.0",
    "angular-cli-builders": "^2.1.0",
    "babel-core": "^6.26.3",
    "codelyzer": "^5.1.2",
    "commitizen": "^3.0.5",
    "conventional-changelog-cli": "^2.0.1",
    "cz-customizable": "^5.3.0",
    "fs-extra": "^6.0.1",
    "gulp": "^4.0.2",
    "gulp-file": "^0.4.0",
    "gulp-foreach": "^0.1.0",
    "gulp-replace": "^0.6.1",
    "highlight.js": "^9.12.0",
    "husky": "^1.3.1",
    "jasmine": "~2.99.0",
    "jasmine-core": "~2.99.1",
    "jasmine-marbles": "^0.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "jest": "^23.6.0",
    "karma": "~2.0.4",
    "karma-chrome-launcher": "^2.2.0",
    "karma-coverage-istanbul-reporter": "^2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "karma-scss-preprocessor": "^3.0.0",
    "lint-staged": "^8.1.0",
    "marked": "^0.4.0",
    "ng-packagr": "^9.0.0-rc.2",
    "ngx-speculoos": "^0.2.3",
    "node-minify": "^3.1.0",
    "node-sass": "^4.13.0",
    "node-sass-tilde-importer": "^1.0.2",
    "optimist": "^0.6.1",
    "prettier": "^1.15.3",
    "protractor": "~5.1.2",
    "shallow-render": "7.0.0",
    "ts-jest": "^22.4.5",
    "ts-node": "^8.3.0",
    "tsickle": ">=0.25.5",
    "tslib": "^1.10.0",
    "tslint": "^5.10.0",
    "tslint-config-prettier": "^1.18.0",
    "typescript": "^3.6.4"
  },```

thanks in advance for your answers.
4

2 回答 2

0

升级 Angular 后运行npm audit命令并获取现有冲突。可能是一些第三方库可能与最新的 Angular 不兼容。根据上述命令的输出，您可能会有所了解。

于 2020-06-11T07:39:20.557 回答
0

角度升级到 9.x

我已经为我们的项目做了一个笔记，这可能会对你有所帮助。如果您发现任何挑战，请随时提出，我们很乐意为您提供帮助。

请按照以下步骤操作，具体取决于您的要求，可能需要的很少。

用于路由

const routes: Routes = [
 { 
  path: 'lazy',
  loadChildren: './lazy/lazy.module#LazyModule', // use this syntax for non-ivy or Angular 7 and below
loadChildren : () => import('./lazy/lazy.module').then(m => m.LazyModule)**, // new dynamic import method in angular 8 or above
  }
];

- - - - - - - - - - - - 笔记：

错误 TS1323：仅当“--module”标志为“commonjs”或“esNext”时才支持动态导入**

解决上述问题

您正在使用动态导入，因此您必须像这样更改您的 tsconfig.json 以将您的代码定位到 esnext 模块**

{
"compileOnSave":  false,
"compilerOptions":  {
"baseUrl":  "./",
"outDir":  "./dist/out-tsc",
"sourceMap":  true,
"declaration":  false,
"module":  "esnext",  // add this line**
"moduleResolution":  "node",
"emitDecoratorMetadata":  true,
"experimentalDecorators":  true,
"importHelpers":  true,
"target":  "es2015",
"typeRoots":  [
"node_modules/@types"
],
"lib":  ["es2018","dom"]
  }
}

笔记：

还要确保检查 tsconfig.app.json 没有类似这样的模块和目标配置**

{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/app",
"types": []
},
"include": [
"src/**/*.ts"
],
"exclude": [
"src/test.ts",
"src/**/*.spec.ts"
 ]
}

注意：**以下情况仅适用于角材料如果您使用角材料，那么您必须导入特定的导入，如下所示我有一个小列表————————————————————— ——— _ErrorMessage:_ Angular 材料未找到

_- 解决方案_

import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatNativeDateModule, MatOptionModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatListModule } from '@angular/material/list';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import { MatNativeDateModule,} from '@angular/material/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';

==================================================== ====

使用以下代码更新 Angular 项目

ng 更新 ng 更新 @angular/core

==================================================== ==== 如果您收到我在下面提到的这些错误，那么您只需相应地配置您的tsconfig.app.json

错误信息：

TypeScript 编译，但未使用。 仅将入口点添加到 tsconfig 中的“文件”或“包含”属性。

— tsconfig.app.json

{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
// "module": "es2015",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts",
" ../../environments/*.ts"
 ],
}

___ 在某些项目中，此文件将类似于 —> tsconfig.app.json


{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/app",
"types": []
},
"files": [
"src/main.ts",
"src/polyfills.ts"
],
"include": [
"src/**/*.ts"
],
"exclude": [
"src/test.ts",
"src/**/*.spec.ts",
"**/*.spec.ts",
"src/././environments/*.ts"
]
}
于 2020-06-11T09:22:37.177 回答