TypeScript IntelliSense for Angular2 in Visual Studio 2015



我使用"ASP.NET Core Web应用程序(.NET Core)"空项目模板创建了一个项目。我正在做Angular2快速入门教程https://angular.io/guide/quickstart.这一切都很好,我已经开始快速启动项目了。

问题是,现在我开始添加自己的TypeScript文件,Angular2的intellisense似乎不起作用。

我安装了TypeScript 1.8.10。

我在包.json中使用@angular/dependencies,如下所示;

{
"name": "product-management",
"version": "1.0.0",
"author": "Deborah Kurata",
"description": "Package for the Acme Product Management sample application",
"scripts": {
"start": "concurrently "npm run tsc:w" ",
"tsc": "tsc",
"tsc:w": "tsc -w",
"typings": "typings",
"postinstall": "typings install",
"gulp": "gulp"
},
"license": "ISC",
"dependencies": {
"@angular/common": "2.0.0-rc.1",
"@angular/compiler": "2.0.0-rc.1",
"@angular/core": "2.0.0-rc.1",
"@angular/http": "2.0.0-rc.1",
"@angular/platform-browser": "2.0.0-rc.1",
"@angular/platform-browser-dynamic": "2.0.0-rc.1",
"@angular/router": "2.0.0-rc.1",
"@angular/router-deprecated": "2.0.0-rc.1",
"@angular/upgrade": "2.0.0-rc.1",
"systemjs": "0.19.29",
"core-js": "2.4.0",
"reflect-metadata": "0.1.3",
"rxjs": "5.0.0-beta.6",
"zone.js": "0.6.12",
"angular2-in-memory-web-api": "0.0.11",
"bootstrap": "3.3.6"
},
"devDependencies": {
"concurrently": "^2.0.0",
"typescript": "^1.8.10",
"typings": "1.0.4",
"gulp": "3.9.1",
"gulp-clean": "0.3.2"
},
"repository": { }
}

这是我的tsconfig.json文件;

{
"compilerOptions": {
"target": "es5",
"module": "system",
"moduleResolution": "node",
"noImplicitAny": true,
"noEmitOnError": true,
"sourceMap": true,
"experimentalDecorators": true,
"emitDecoratorMetadata": true
},
"compileOnSave": true
}

还有我的打字员.json文件;

{
"globalDependencies": {
"core-js": "registry:dt/core-js#0.0.0+20160317120654",
"jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
"node": "registry:dt/node#4.0.0+20160509154515"
}
}

打字员文件夹是在我的项目的根目录下自动创建的,其中包括用于上述库打字员的文件夹。

这是我的项目结构;

项目_结构

当我在"node_modules/@angular/"文件夹中查看时,我可以看到它们包含TypeScript定义的*.d.ts文件,但是,正如你从图像中看到的那样,这个文件夹没有"包括"在我的项目中,所以我不确定visual studio是否正在使用.d.ts文件。。。?

我一直在寻找答案,但很多帖子都不是基于使用Visual Studio 2015,而是使用了旧的依赖关系"angular2",而不是新的依赖关系结构"@angular"。

有人能告诉我在visual studio 2015中检查/配置什么以使TypeScript intellisense与Angular2一起工作的正确方向吗。

最后,当我说它不起作用时,如果我添加了一个文件,如"file.ts",然后尝试键入像@Component这样的东西(它应该会命中Angular2 intellisense),它不会,而是会建议在.中使用"Component"进行其他命中

谢谢你的帮助。

我意识到我的intellisense问题是我编写typescript文件的顺序。。。(非常尴尬)。

当我首先在顶部写入导入语句时,即

import { Component } from "@angular/core"

然后开始写下面的角度,智能感觉很好。。

@Component({
})
export class AppComponent {
pageTitle: string = "Acme Product Management";
}

最新更新