通過Typings為Visual Studio Code增強智能提示功能


緣起

最近在學習Node.jsThinkJS這個框架,用vscode作為開發環境。默認情況下vscode對ThinkJS的代碼提示並不好,所以研究了一下,原來可以同通過Typings來讓vscode擁有強大的智能代碼提示功能

通過NPM安裝Typings

npm install -g typings  //在node環境下安裝typings
typings --version       //查看typings當前版本

通過Typings安裝代碼提示信息文件

例如我們此處需要安裝jquery的代碼提示文件,項目目錄為c:\test

cd test  //進入到項目目錄
typings install jquery --save //該命令應該在項目目錄下運行

此時我們可以看到項目目錄下多了些文件。

1

這些文件就是為我們提供提示信息的類型類型文件(擴展名為.d.ts)。

ThinkJS的代碼提示文件 從https://github.com/75team/thinkjs/blob/master/template/think.d.ts 下載放到typings目錄下

查看Typings是否支持某個庫或框架的智能提示,我們可以使用下面的命令:

typings search exampleName

啟用智能提示功能

  1. 方法一:在需要進行只能提示的文件最上行增加提示信息文件所在目錄,格式如下:

    /// <reference path="./typings/think.d.ts" />

這里需要注意 自己根據實際情況修正 path 指定的.d.ts文件路徑

  1. 方法二:在項目所在目錄(在這里是NodeSnippet文件夾中)增加一個名為jsconfig.json的空文件。

jsconfig.json文件的內容可以參考:https://code.visualstudio.com/docs/languages/javascript

注意事項

Typings VS TSD

Typings是作為TSD的替代者而出現的,如果你已經安裝了TSD,那么需要知道現在TSD已經不推薦使用了。如果已經安裝TSD請執行下面的命令來移除它:

npm rm -g tsd

使用 CNPM 安裝 node包

有時候使用NPM安裝模塊很慢,此時我們可以選擇國內淘寶的NPM鏡像,使用下面的命令來進行安裝:

npm install -g cnpm --registry=https://registry.npm.taobao.org

安裝完成后使用cnpm來代替npm命令即可,例如下面安裝一個lodash模塊的示例:

cnpm install lodash 

參考閱讀

https://github.com/typings/typings
https://code.visualstudio.com/docs/languages/javascript
https://npm.taobao.org/
http://www.cnblogs.com/IPrograming/archive/2016/04/30/VsCodeTypings.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM