使用Visual Studio Code開發AngularJS Step by Step

Step1：安裝Node.js （下載地址：https://nodejs.org/en/）

Step2：安裝TypeScript definition file（tsd文件，由於VSC把全部Javascript都看成Typescript，也就是說VSC會用Typescript的編譯器來處理Javascript文件，因此會產生一些警告信息）。執行命令以下：

npm install -g tsd

注意：該命令註冊在全局做用域下（也就是在任何文件夾下均可以使用）

Step3：在工做目錄（使用VSC指定工做目錄爲Test）下初始化tsd，執行命令以下：

tsd init

 

注意：該命令要在工做根目錄下執行

該命令會在工做目錄下建立tsd.json和/typings/tsd.d.ts文件，其中tsd.json文件爲配置文件，tsd.d.ts爲項目所須要引用配置文件（tsd.d.ts文件截圖爲最終完成截圖）

 

 

Step4：添加單元測試文件（這一步沒有必要，能夠直接跳過。主要是angularjs指出的測試中有用到，因此在些就添加），執行命令以下：

tsd query jasmine angular-protractor –-action install --save

注意：該命令一樣是在工做根目錄下執行，最終效果會在tsd.json和/typings/tsd.d.ts文件中添加信息。詳情見截圖：

 

 

Step5：實現對AngularJs的Module和Services的智能感知支持，執行命令以下：

tsd query angular –action install --save

 

注意：該命令一樣是在工做根目錄下執行，最終效果見step4

Step6：在文件中添加引用，引用tsd.d.ts（該文件包含了全部引用，直接引用它就能夠了），就能夠實現智能提示了，在文件最開始部分添加：

/// <reference path="../typings/tsd.d.ts" /> 注意路徑，js文件對應的相對路徑。

 

請參考文章：http://blogs.msdn.com/b/vscode/archive/2015/05/22/getting-started-with-angular-and-visual-studio-code.aspx