IntelliJ & Angular2/TypeScript - 错误 TS2307: 找不到模块 'angular2/...'
关于这个问题似乎有很多问答,但到目前为止,我找到的大多数答案都是针对 Windows/Visual Studio 的。我正在使用 OSX 和 IntelliJ 进行我正在开发的 Angular2 + TypeScript 项目,目前在从 angular2 库导入时(例如在我的 app.ts 中),导入语句中的“from”位置下显示警告/错误(那些小红色波浪线),例如我有:
/// <reference path="node_modules/angular2/ts/typings/node/node.d.ts"/>
/// <reference path="node_modules/angular2/typings/browser.d.ts"/>
import { bootstrap } from "angular2/platform/browser";
import { Component } from "angular2/core";
import { ROUTER_DIRECTIVES, ROUTER_PROVIDERS, RouteConfig} from 'angular2/router';
所有 3 个导入语句在 from 位置下都有警告(我们有 “angular2/....” 的地方)。我尝试通过在 Intellij 中编辑 typescript-compiler.xml 来纠正这个问题:
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="TypeScriptCompiler">
<option name="isCompilerEnabled" value="true" />
<option name="typeScriptServiceDirectory" value="$USER_HOME$/node_modules/typescript/bin" />
<option name="typeScriptCompilerParams" value="-m amd -t ES5" />
<option name="versionType" value="SERVICE_DIRECTORY" />
</component>
</project>
我导入的其他模块都没有问题(比如我自己写的组件),但从 Angular2 导入的那些模块却有警告?有人设法解决过这个错误/问题吗?我已经尝试了一段时间想解决这个问题。我目前安装的 TypeScript 版本是 1.7.5。
请注意,我的 dev-dependancies 中没有 typings.json 文件或安装 npm typings。
这是我的 tsconfig.json 文件:
{
"compilerOptions": {
"target": "ES5",
"module": "system",
"moduleResolution": "node",
"sourceMap": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false
},
"files": [
// there is an array of files here
],
"filesGlob": [
"app/**/*.ts"
],
"exclude": [
"node_modules"
],
"atom": {
"rewriteTsconfig": true
}
}
这是我的 tslint.json 文件:
{
"rules": {
"align": [true,
"parameters",
"arguments",
"statements"],
"class-name": true,
"comment-format": [true, "check-space"],
"curly": true,
"eofline": true,
"forin": true,
"indent": [true, "spaces"],
"interface-name": true,
"label-position": true,
"label-undefined": true,
"jsdoc-format": true,
"max-line-length": [true, 80],
"member-ordering": [true,
"public-before-private",
"static-before-instance",
"variables-before-functions"
],
"no-arg": true,
"no-bitwise": true,
"no-console": [true,
"debug",
"info",
"time",
"timeEnd",
"trace"
],
"no-construct": true,
"no-debugger": true,
"no-duplicate-key": true,
"no-duplicate-variable": true,
"no-empty": true,
"no-eval": true,
"no-require-imports": true,
"no-shadowed-variable": true,
"no-string-literal": true,
"no-switch-case-fall-through": true,
"no-trailing-comma": true,
"no-trailing-whitespace": true,
"no-unused-expression": true,
"no-unused-variable": true,
"no-unreachable": true,
"no-use-before-declare": true,
"no-var-keyword": true,
"one-line": [true,
"check-open-brace",
"check-catch",
"check-else",
"check-whitespace"
],
"quotemark": [true, "single"],
"radix": true,
"semicolon": true,
"sort-object-literal-keys": false,
"triple-equals": [true, "allow-null-check"],
"typedef": [true,
"call-signature",
"parameter",
"property-declaration",
"variable-declaration",
"member-variable-declaration"
],
"typedef-whitespace": [true, {
"call-signature": "nospace",
"index-signature": "nospace",
"parameter": "nospace",
"property-declaration": "nospace",
"variable-declaration": "nospace"
}],
"variable-name": [true,
"allow-leading-underscore"],
"whitespace": [true,
"check-branch",
"check-decl",
"check-operator",
"check-separator",
"check-type"
]
}
}
答案#1
对我来说,这是通过使用相对路径解决的,即(取决于你的 .ts 文件的位置):
///<reference path="../../node_modules/angular2/typings/browser.d.ts"/>
另外,在你的 Intellij 设置中,确保启用“使用 tsconfig.json”。我的设置文件看起来是这样的:
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="TypeScriptCompiler">
<option name="isCompilerEnabled" value="true" />
<option name="typeScriptCompilerParams" value="--module "amd" --target "ES5" --experimentalDecorators" />
<option name="useConfig" value="true" />
</component>
</project>
请注意,自几小时前 angular2 rc.1 已发布 (https://github.com/angular/angular/blob/3229bf16656749427d1def38ced0e1d1d2ae1fa4/CHANGELOG.md)
这引入了一些关于如何导入模块的重大更改(例如,“angular/core”变为“@angular/core”)。
如果你使用的是 rc 版本,就不再需要 ///<reference path=".."/> 这些东西了。System.js 会自动在 node_modules 目录中找到对应的 index.d.ts(如果设置正确:https://github.com/angular/quickstart/blob/master/systemjs.config.js)
我还必须将目标更改为 ES6,否则我会收到错误消息,例如 Map 或 Promise 未定义。如果你仍然想保留 ES5 目标,你需要包含 es6-shim(.js 和 .d.ts)。
