添加 Angular SSR 会引发错误发生未处理的异常：npm ERR！代码 ERESOLVE答案

【问题标题】：Adding Angular SSR throws error An unhandled exception occurred: npm ERR! code ERESOLVE添加 Angular SSR 会引发错误发生未处理的异常：npm ERR！代码 ERESOLVE
【发布时间】：2021-06-06 09:50:18
【问题描述】：

我正在尝试按照here in the docs 中列出的步骤将服务器端渲染添加到我的应用程序中

第一步是运行

ng add @nguniversal/express-engine

不幸的是，这会引发以下错误

An unhandled exception occurred: npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: angular-dark-light@0.0.0
npm ERR! Found: @angular/animations@11.1.2
npm ERR! node_modules/@angular/animations
npm ERR!   @angular/animations@"~11.1.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/animations@"11.2.4" from @angular/platform-server@11.2.4
npm ERR! node_modules/@angular/platform-server
npm ERR!   peer @angular/platform-server@"^11.1.2" from @nguniversal/express-engine@11.1.2
npm ERR!   node_modules/@nguniversal/express-engine
npm ERR!     @nguniversal/express-engine@"11.1.2" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\KOTIENO1\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\KOTIENO1\AppData\Local\npm-cache\_logs\2021-03-08T13_41_15_774Z-debug.log
Package install failed, see above.
See "C:\Users\KOTIENO1\AppData\Local\Temp\ng-m8ttIF\angular-errors.log" for further details.

我尝试使用--force 运行命令，但抛出相同的错误

下面是我的package.json文件

{
  "name": "angular-dark-light",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~11.1.1",
    "@angular/cdk": "^11.2.3",
    "@angular/common": "~11.1.1",
    "@angular/compiler": "~11.1.1",
    "@angular/core": "~11.1.1",
    "@angular/forms": "~11.1.1",
    "@angular/material": "^11.2.3",
    "@angular/platform-browser": "~11.1.1",
    "@angular/platform-browser-dynamic": "~11.1.1",
    "@angular/router": "~11.1.1",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.11.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1101.2",
    "@angular-eslint/builder": "1.2.0",
    "@angular-eslint/eslint-plugin": "1.2.0",
    "@angular-eslint/eslint-plugin-template": "1.2.0",
    "@angular-eslint/schematics": "1.2.0",
    "@angular-eslint/template-parser": "1.2.0",
    "@angular/cli": "~11.1.2",
    "@angular/compiler-cli": "~11.1.1",
    "@types/jasmine": "~3.6.0",
    "@types/node": "^12.11.1",
    "@typescript-eslint/eslint-plugin": "4.3.0",
    "@typescript-eslint/parser": "4.3.0",
    "eslint": "^7.6.0",
    "eslint-plugin-import": "2.22.1",
    "eslint-plugin-jsdoc": "30.7.6",
    "eslint-plugin-prefer-arrow": "1.2.2",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.2.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "typescript": "~4.1.2"
  }
}

我该如何解决这个问题？

【问题讨论】：

标签： angular npm angular-cli angular-universal

【解决方案1】：

我发现了问题所在。该问题与@angular/universal 无关，而是与package.json 上已安装和软件包版本之间的npm 软件包不匹配

为了解决，我按照以下步骤操作

运行npm install --force
运行ng add @nguniversal/express-engine

【讨论】：