@types 在 Angular 4 TypeScript 应用程序中不起作用

Question

我有一个用 TypeScript 编写的小型 Angular 4 应用程序，它还使用 Webpack 和 Jasmine 测试框架。

我已经为 Jasmine 和 Node 安装了 @types 包，例如：@types/jasmine 和 @types/node，并且可以在 node_modules 文件夹中找到它们。

但是，当我构建应用程序时，我在命令行中看到错误 window 例如：

ERROR in [at-loader] ./app/welcome/app.welcome.spec.ts:4:1 TS2304: Cannot find name 'describe'.

应用程序本身似乎仍然有效，只是看到这些错误很烦人。

我的package.json文件如下：

{
    "name": "ng4-ts-demo",
    "version": "1.0.0",
    "description": "An Angular4 with TypeScript demo",
    "main": "main.ts",
    "scripts": {
        "test": "karma start",
        "build": "webpack --config webpack.config.js"
     },
     "author": "Dan",
     "license": "MIT",
     "devDependencies": {
         "@types/jasmine": "^2.5.52",
         "@types/node": "^7.0.31",
         "angular2-template-loader": "^0.6.2",
         "awesome-typescript-loader": "^3.1.3",
         "clean-webpack-plugin": "^0.1.16",
         "css-loader": "^0.28.1",
         "html-loader": "^0.4.5",
         "html-webpack-plugin": "^2.28.0",
         "jasmine-core": "^2.6.1",
         "karma": "^1.6.0",
         "karma-chrome-launcher": "^2.1.0",
         "karma-coverage": "^1.1.1",
         "karma-jasmine": "^1.1.0",
         "karma-sourcemap-loader": "^0.3.7",
         "karma-webpack": "^2.0.3",
         "node-sass": "^4.5.2",
         "sass-loader": "^6.0.3",
         "style-loader": "^0.17.0",
         "typescript": "^2.3.4",
         "webpack": "^2.4.1"
     },
     "dependencies": {
         "@angular/cli": "^1.0.2",
         "@angular/common": "^4.1.0",
         "@angular/compiler": "^4.1.0",
         "@angular/core": "^4.1.0",
         "@angular/platform-browser": "^4.1.0",
         "@angular/platform-browser-dynamic": "^4.1.0",
         "core-js": "^2.4.1",
         "moment": "^2.18.1",
         "reflect-metadata": "^0.1.10",
         "rxjs": "^5.3.1",
         "zone.js": "^0.8.9"
     }
}

编辑

我通过在我的测试-main.ts 文件中导入类型模块修复了 Jasmine 问题：

import '@types/jasmine';

但是，在我的 main.ts 文件中导入节点类型并不能解决问题。它确实删除了错误，例如：

ERROR in [at-loader] ./test-main.ts:16:18 TS2304: Cannot find name 'require'.

但是我看到了错误：

ERROR in ./main.ts Module not found: Error: Can't resolve '@types/node'

并且在浏览器的控制台中我看到了类似的消息

Uncaught Error: Cannot find module "@types/node"

编辑 2

Jasmine 错误仅在进行常规构建时得到修复。实际上运行测试（使用 Karma）时，我看到：

Module not found: Error: Can't resolve '@types/jasmine'

我一直在使用 official Angular/Webpack docs，这里没有提到这些错误，也没有在任何地方导入 @types，从我到处看到的情况来看，@types 安装后应该就可以使用了..?

.tsconfig文件位于项目根目录下（与node_modules同级），内容如下：

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "lib": [ "es2015", "dom" ],
        "noImplicitAny": true,
        "suppressImplicitAnyIndexErrors": true
    }
}

Answer 1

作为参考，这似乎是 awesome-typescript-loader 的问题。我卸载了它并切换到 ts-loader，这些问题就消失了。

我确认安装 @types/node、@types/jasmine 和 @types/webpack-env 就足够了，根本不需要在 webpack.conf.js 或 .tsconfig 中进行任何额外的特殊配置。

@types 在 Angular 4 TypeScript 应用程序中不起作用

@types not working in Angular 4 TypeScript app

jasmine

typescript

typescript-typings

angular

编辑

编辑 2