将我的 Angular 项目从 5x 升级到 6x 后的问题答案

【问题标题】：Problems after upgrading my Angular project from 5x to 6x将我的 Angular 项目从 5x 升级到 6x 后的问题
【发布时间】：2019-07-02 14:31:36
【问题描述】：

我刚刚按照通常的指南将我的 Angular 5 项目升级到了 6。我已经更新了我的包并安装了 rxjs-compat 包并运行以下命令从 rxjs 5 迁移到 rxjs 6

npm install -g rxjs-tslint

npm install rxjs-compat --save

rxjs-5-to-6-migrate -p tsconfig.json

我的 package.json 如下所示

{
  "name": "srm-portal",
  "version": "1.0.0",
  "description": "",
  "main": "wwwroot/index.html",
  "author": "",
  "license": "ISC",
  "scripts": {
    "ngc": "ngc -p ./tsconfig-aot.json",
    "start": "concurrently \"webpack-dev-server --hot --inline --port 8080\" \"dotnet run\" ",
    "webpack-dev": "set NODE_ENV=development && webpack",
    "webpack-production": "set NODE_ENV=production && webpack",
    "build-dev": "npm run webpack-dev",
    "build-production": "npm run ngc && npm run webpack-production",
    "watch-webpack-dev": "set NODE_ENV=development && webpack --watch --color",
    "watch-webpack-production": "npm run build-production --watch --color",
    "publish-for-iis": "npm run build-production && dotnet publish -c Release"
  },
  "dependencies": {
    "@angular/animations": "^6.0.0",
    "@angular/common": "^6.0.0",
    "@angular/compiler": "^6.0.0",
    "@angular/compiler-cli": "^6.0.0",
    "@angular/core": "^6.0.0",
    "@angular/forms": "^6.0.0",
    "@angular/http": "^6.0.0",
    "@angular/platform-browser": "^6.0.0",
    "@angular/platform-browser-dynamic": "^6.0.0",
    "@angular/platform-server": "^6.0.0",
    "@angular/router": "^6.0.0",
    "@angular/upgrade": "~4.3.0",
    "angular-in-memory-web-api": "0.3.2",
    "angular2-chartjs": "^0.2.0",
    "angular2-notifications": "^0.7.4",
    "angular2-redux": "^4.0.0",
    "core-js": "2.5.6",
    "date-input-polyfill": "^2.14.0",
    "font-awesome": "4.7.0",
    "ie-shim": "~0.1.0",
    "linkifyjs": "^2.1.4",
    "ng2-appinsights": "^1.0.0-beta.1",
    "ng2-currency-mask": "^4.3.1",
    "ng2-dnd": "^4.2.0",
    "ng2-toasty": "^4.0.3",
    "ng2-validation": "^4.2.0",
    "ngx-chips": "1.5.3",
    "ngx-easy-table": "2.2.0",
    "ngx-pagination": "3.0.3",
    "powerbi-client": "^2.4.7",
    "primeicons": "^1.0.0-beta.10",
    "primeng": "^6.1.2",
    "redux": "^3.6.0",
    "redux-thunk": "^2.2.0",
    "reflect-metadata": "0.1.10",
    "rxjs": "^6.1.0",
    "rxjs-compat": "^6.4.0",
    "zone.js": "0.8.26"
  },
  "devDependencies": {
    "@types/node": "10.0.6",
    "angular-router-loader": "^0.6.0",
    "angular2-template-loader": "0.6.2",
    "awesome-typescript-loader": "3.1.2",
    "clean-webpack-plugin": "^0.1.16",
    "copy-webpack-plugin": "^4.0.1",
    "css-loader": "^0.28.0",
    "file-loader": "^0.11.1",
    "html-webpack-plugin": "^2.28.0",
    "json-loader": "^0.5.4",
    "node-sass": "^4.5.3",
    "raw-loader": "^0.5.1",
    "sass-loader": "^6.0.3",
    "source-map-loader": "^0.2.1",
    "style-loader": "^0.16.1",
    "ts-helpers": "^1.1.2",
    "tslint": "^5.1.0",
    "tslint-loader": "^3.5.2",
    "typescript": "2.7.2",
    "url-loader": "^0.5.8",
    "webpack": "^2.4.1",
    "webpack-dev-server": "2.4.2"
  },
  "-vs-binding": {
    "ProjectOpened": [
      "watch-webpack-dev"
    ]
  }
}

我正在使用 Visual Studio 2017，并且错误列表中显示了许多错误

谁能提供进一步的帮助和建议？

请看附件图片

Types.d.ts error http service api error

我的项目属性如下所示

Project Properties

【问题讨论】：

标签： angular rxjs migration rxjs6 rxjs-compat

【解决方案1】：

我曾经遇到过类似的问题，因为我的 Angular 应用程序是 ASP.NET 项目的一部分。在这个项目中，我也使用打字稿，但不同的（旧）版本。检查您的项目属性：

我在 .csproj 文件中添加了一个目标，以在我的 Angular 应用程序目录中忽略打字稿。

  <Target Name="RemoveClientAppTsConfig" AfterTargets="FindConfigFiles">
    <ItemGroup>
      <ConfigFiles Remove="ClientApp/**" />
    </ItemGroup>
    <Message Importance="high" Text="remove all tsconfig.json under ClientApp" />
  </Target>

我将 Angular 应用程序 (ClientApp) 添加到用于 ASP.NET 项目的 tsconfig.json 中的排除项（不在 Angular 应用程序的 tsconfig.json 中！）。

【讨论】：