Angular 9升级至14时npm与ng升级命令报错求助

我尝试按照Angular官方升级指南将Angular 9项目升级至14版本，执行npm i命令时出现错误：

"An unhandled exception occurred: request to http://registry.npmjs.org/@angular%2fcli failed, reason: socket hang up"

执行npx @angular/cli@10 update @angular/core@10 @angular/cli@10命令时也出现异常。已尝试删除并重新创建node_modules及package-lock.json，但未解决问题。项目的package.json如下：

{
  "name": "ez-new-architecture",
  "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": {
    "@akveo/ng2-completer": "^9.0.1",
    "@angular-redux/store": "^10.0.0",
    "@angular/animations": "^9.1.13",
    "@angular/common": "^9.1.13",
    "@angular/compiler": "^9.1.13",
    "@angular/core": "^9.1.13",
    "@angular/forms": "^9.1.13",
    "@angular/http": "^7.2.16",
    "@angular/localize": "^9.1.13",
    "@angular/platform-browser": "^9.1.13",
    "@angular/platform-browser-dynamic": "^9.1.13",
    "@angular/router": "^9.1.13",
    "@fortawesome/angular-fontawesome": "^0.7.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.30",
    "@fortawesome/free-solid-svg-icons": "^5.13.0",
    "@fullcalendar/angular": "^5.3.1",
    "@fullcalendar/common": "^5.3.1",
    "@fullcalendar/core": "^5.3.1",
    "@fullcalendar/daygrid": "^5.3.1",
    "@fullcalendar/interaction": "^5.3.1",
    "@fullcalendar/list": "^5.3.1",
    "@fullcalendar/timegrid": "^5.3.1",
    "@ng-bootstrap/ng-bootstrap": "^5.3.1",
    "@ngx-loading-bar/core": "^4.2.0",
    "@ngx-loading-bar/router": "^4.2.0",
    "@types/braintree-web": "^3.62.2",
    "angular-dual-listbox": "^5.0.1",
    "angular-google-recaptcha": "^1.0.3",
    "angular-resize-event": "^2.0.1",
    "angular-sweetalert-service": "^2.0.2",
    "animate-sass": "^0.8.2",
    "bootstrap": "^4.3.1",
    "braintree-web": "^3.64.2",
    "card-validator": "^8.1.0",
    "chart.js": "^2.8.0",
    "core-js": "^2.6.10",
    "file-saver": "^2.0.5",
    "font-awesome": "^4.7.0",
    "fullcalendar": "^5.3.2",
    "fullcalendar-scheduler": "^5.3.2",
    "idle-session-timeout": "^1.0.1",
    "jquery": "^3.5.1",
    "lodash": "^4.17.20",
    "ng2-charts": "^2.2.2",
    "ng2-completer": "^9.0.1",
    "ng2-smart-table": "^1.6.0",
    "ngx-bootstrap": "^5.6.1",
    "ngx-device-detector": "^2.0.0",
    "ngx-fullcalendar": "^5.0.0-alpha.1",
    "ngx-material-timepicker": "^5.5.3",
    "ngx-owl-carousel": "^2.0.7",
    "ngx-perfect-scrollbar": "^8.0.0",
    "ngx-plaid-link": "^1.0.3",
    "ngx-quill": "^14.2.0",
    "ngx-spinner": "^7.2.0",
    "pe7-icon": "^1.0.4",
    "protractor": "^7.0.0",
    "quill": "^1.3.7",
    "redux": "^4.0.0",
    "redux-devtools-extension": "^2.13.8",
    "rxjs": "~6.6.2",
    "rxjs-compat": "^6.6.7",
    "source-map-resolve": "^0.6.0",
    "sweetalert2": "^9.17.1",
    "tslib": "^1.10.0",
    "xlsx": "^0.17.1",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.901.13",
    "@angular/cli": "^9.1.13",
    "@angular/compiler-cli": "^9.1.13",
    "@angular/language-service": "^9.1.13",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^14.6.0",
    "codelyzer": "^5.1.2",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.0.0",
    "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",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~3.8.3"
  }
}

解决方案 #

1. 修复网络连接问题

socket hang up错误本质是npm与官方源的连接中断，可通过以下方式解决：

• 切换至国内npm镜像：

  npm config set registry https://registry.npmmirror.com/
  

• 清除npm缓存：

  npm cache clean --force
  

• 检查并调整代理设置：

  # 若使用代理，配置代理地址
  npm config set proxy http://your-proxy:port
  npm config set https-proxy http://your-proxy:port
  
  # 无代理则清空代理配置
  npm config delete proxy
  npm config delete https-proxy
  

2. 严格分步升级

Angular跨大版本升级必须遵循9→10→11→12→13→14的顺序，不能跨版本直接升级：

• 先确保Angular 9项目依赖安装正常（解决网络问题后执行npm i）
• 升级至Angular 10：

  npx @angular/cli@10 update @angular/core@10 @angular/cli@10 --force
  

• 每完成一个版本升级后，检查第三方依赖兼容性：
  • @angular/http已废弃，需替换为@angular/common/http
  • ngx-quill@14.2.0不兼容Angular 10，需降级至对应兼容版本
  • core-js@2.x需升级至core-js@3.x以支持更高版本Angular
• 重复上述步骤，逐步升级到Angular 14

3. 手动修改依赖版本（备选）

若自动升级命令仍报错，可手动修改package.json中Angular相关依赖版本，再执行安装：
以升级至Angular 10为例，修改核心依赖：

"@angular/animations": "^10.2.5",
"@angular/common": "^10.2.5",
"@angular/compiler": "^10.2.5",
"@angular/core": "^10.2.5",
"@angular/forms": "^10.2.5",
"@angular/localize": "^10.2.5",
"@angular/platform-browser": "^10.2.5",
"@angular/platform-browser-dynamic": "^10.2.5",
"@angular/router": "^10.2.5",
"@angular/cli": "^10.2.5",
"@angular-devkit/build-angular": "^0.1002.5",
"@angular/compiler-cli": "^10.2.5",
"@angular/language-service": "^10.2.5",
"typescript": "~3.9.7",
"rxjs": "~6.6.7",
"zone.js": "~0.10.3"

修改后删除node_modules和package-lock.json，执行npm i

内容的提问来源于stack exchange，提问作者Krishnaraj P