从角度2升级到角度5的错误

我正在尝试将Angular 2 Visual Studio项目升级到Angular 5.我在编译时运气相当不错，直到我尝试将角度/路由器升级到兼容版本 . 原始的“3.0.0-rc.1”编译但使用OpaqueTokens，因此它不起作用 .

当我尝试在新的package.json中指定的角度/路由器的版本添加下面所有类型的普通typsescript类型（如布尔值）时，不会被识别 . 看起来编译器完全搞砸了 . 我不知道我是否需要@ angular / upgrade这个版本的代码 .

我试图做How to update / upgrade from Angular 4 to Angular 5中提到的一些事情，但没有一个公认的解决方案适合我 .

原始的角度2 package.json是：

"dependencies": {
    "@angular/common": "2.0.0-rc.5",
    "@angular/compiler": "2.0.0-rc.5",
    "@angular/core": "2.0.0-rc.5",
    "@angular/forms": "0.3.0",
    "@angular/http": "2.0.0-rc.5",
    "@angular/platform-browser": "2.0.0-rc.5",
    "@angular/platform-browser-dynamic": "2.0.0-rc.5",
    "@angular/router": "3.0.0-rc.1",
    "@angular/upgrade": "2.3.0-rc.0",
    "bootstrap": "^3.3.6",
    "core-js": "^2.4.1",
    "es6-shim": "^0.35.0",
    "font-awesome": "^4.7.0",
    "karma-coverage": "^1.1.1",
    "reflect-metadata": "^0.1.8",
    "remap-istanbul": "^0.8.4",
    "rxjs": "5.0.0-rc.4",
    "systemjs": "0.19.40",
    "zone.js": "^0.7.2"
},
"devDependencies": {
    "@types/jasmine": "2.5.36",
    "@types/node": "^6.0.63",
    "babel-core": "^6.23.1",
    "browserify": "^14.1.0",
    "canonical-path": "0.0.2",
    "compress": "^0.99.0",
    "concurrently": "^3.1.0",
    "del": "^2.2.2",
    "gulp": "^3.9.1",
    "gulp-concat": "^2.6.1",
    "gulp-imagemin": "^3.1.1",
    "gulp-sourcemaps": "^2.4.1",
    "gulp-typescript": "^3.1.5",
    "gulp-uglify": "^2.0.1",
    "http-server": "^0.9.0",
    "jasmine-core": "~2.4.1",
    "karma": "^1.3.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "lite-server": "^2.2.2",
    "lodash": "^4.16.4",
    "mangle": "^1.1.3",
    "protractor": "~4.0.14",
    "rimraf": "^2.5.4",
    "systemjs-builder": "^0.16.3",
    "tslint": "^3.15.1",
    "typescript": "^2.0.10",
    "typings": "^0.7.12",
    "uglifyjs": "^2.4.10"
}

当前配置是：

"dependencies": {
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/platform-browser": "^5.0.0",
    "@angular/platform-browser-dynamic": "^5.0.0",
    "@angular/router": "5.2.10",
    "bootstrap": "^4.1.0",
    "core-js": "^2.4.1",
    "es6-shim": "^0.35.0",
    "font-awesome": "^4.7.0",
    "karma-coverage": "^1.1.1",
    "reflect-metadata": "^0.1.8",
    "remap-istanbul": "^0.11.0",
    "rxjs": "^5.5.2",
    "systemjs": "0.21.3",
    "zone.js": "^0.8.4"
},
"devDependencies": {
    "@types/jasmine": "2.8.6",
    "@types/node": "^9.6.6",
    "babel-core": "^6.23.1",
    "browserify": "^16.2.0",
    "canonical-path": "0.0.2",
    "compress": "^0.99.0",
    "concurrently": "^3.1.0",
    "del": "^3.0.0",
    "gulp": "^3.9.1",
    "gulp-concat": "^2.6.1",
    "gulp-imagemin": "^4.1.0",
    "gulp-sourcemaps": "^2.4.1",
    "gulp-typescript": "^4.0.2",
    "gulp-uglify": "^3.0.0",
    "http-server": "^0.11.1",
    "jasmine-core": "~3.1.0",
    "karma": "^2.0.2",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-jasmine-html-reporter": "^1.0.0",
    "lite-server": "^2.2.2",
    "lodash": "^4.16.4",
    "mangle": "^1.1.3",
    "protractor": "~5.3.1",
    "rimraf": "^2.5.4",
    "systemjs-builder": "^0.16.3",
    "tslib": "1.9.0",
    "tslint": "^5.9.1",
    "typescript": "^2.5.0",
    "typings": "^2.1.1",
    "uglifyjs": "^2.4.10"
}

有人问及package.json中的构建配置

这是package.json文件中的脚本 . 这里有一些错误，即使这适用于角度2，因为当你做npm run build时它抱怨不知道“干净”

"scripts": {
    "start": "concurrently \"npm run tsc:w\" \"npm run lite\" ",
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "typings": "typings",
    "postinstall": "typings install",
    "build": "npm run clean && tsc",
    "test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"",
    "posttest": "node_modules/.bin/remap-istanbul -i coverage/coverage-final.json -o coverage -t html",
    "coverage": "http-server -c-1 -o -p 9875 ./coverage"
}

tsconfig.json文件如下 . 我不得不在文件中添加行“lib”：[“dom”]以防止编译错误 .

{
     "compilerOptions": {
     "target": "es5",
     "lib":  ["dom"], 
     "module": "system",
     "moduleResolution": "node",
     "sourceMap": false, // make this false for minification
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
     "removeComments": false,
     "noImplicitAny": false,
     "noStrictGenericChecks": true,
     "outFile": "./app/app.min.js" // uncomment this line for minification
  },
  "compileOnSave": true,
  "exclude": [
      "node_modules",
      "typings/main",
      "typings/main.d.ts",
      //comment out these two lines for jasmine
      "./app/**/*.spec.ts",
      "./app/*.spec.ts"
   ]
}