簡介
- Node.js是一個幫助開發(fā)應(yīng)用的JavaScript運(yùn)行平臺, 它快速且靈活
- NPM是一個Node.js模塊的包管理程序
- VS Code 支持JavaScript 和TypeScript語言--以及 Node.js 及時調(diào)試, 要想運(yùn)行一個Node.js應(yīng)用, 你需要安裝Node.js的運(yùn)行時環(huán)境
操作系統(tǒng): OS X 10.11.6
版本:
VS Code 1.4
node 6.2.2
code 1.4.0
tsc 1.8.10
npm 3.9.5
- VS Code 提供了一個 code 命令纯丸,用來在 shell 環(huán)境下調(diào)用編輯器萎羔。使用快捷鍵 ??P(或 F1) 喚起命令面板,輸入以下命令即可完成安裝。
mkdir Hello
cd Hello
code .
- 您可以直接從命令行打開文件或文件夾贾陷。這里 '.' 是指到當(dāng)前文件夾,因此 VS Code將啟動并打開當(dāng)前文件夾概说。
代碼提示
- 通過tsd或者typings這兩個工具安裝(兩個工具的作者是同一個人网梢,目前tsd已經(jīng)廢棄了)震缭。
- tsd 和 typings 用法:
- tsd:
//全局安裝
npm install tsd -g
- typings:
//全局安裝
npm install typings -g
- 如果你的電腦上沒有安裝TypeScript Compiler的話,是無法使用tsc這個指令的战虏。要安裝也很簡單
npm install typescript -g
node express拣宰、lodash等的自動補(bǔ)全
typings install dt~node --global
typings install dt~express --global
typings install dt~lodash --global
//vscode官方文檔上express的typings使用的是
typings install dt~express dt~serve-static dt~express-serve-static-core --global
其中”dt~”為使用DefinitelyTyped類型定義的意思,vscode可以識別這種定義烦感。
配置jsconfig.json
- 在使用typings之前巡社,需要在vscode里面配置一下名為jsconfig.json的文件, VS Code通過這個文件找到自動補(bǔ)全文件。配置方法很簡單手趣,隨便選中一個js文件重贺,vscode右下角會彈出一個綠色的小燈泡,如圖所示:
創(chuàng)建package.json
package.json 文件就是定義了項目的各種元信息回懦,包括項目的名稱气笙,git repo 的地址,作者等等怯晕。最重要的是潜圃,其中定義了我們項目的依賴,這樣這個項目在部署時舟茶,我們就不必將 node_modules
目錄也上傳到服務(wù)器谭期,服務(wù)器在拿到我們的項目時,只需要執(zhí)行 npm install
吧凉,則 npm 會自動讀取 package.json 中的依賴并安裝在項目的 node_modules
下面隧出,然后程序就可以在服務(wù)器上跑起來了。
npm init
- 如果只是測試項目或者練習(xí)用阀捅,沒有倉庫地址
- 只需在package.json里面做如下配置即可:
{
...
"private": true,
...
}
以這種方式把項目聲明為私有胀瞪,這樣npm就不會再提示配置repository及readme了
- 否則會遇到這個錯誤
npm WARN package.json xxx@0.0.0 No repository field.
npm WARN package.json xxx@0.0.0 No README data
- 需要配置倉庫路徑
{
...
"repository": {
"type": "git",
"url": "http://github.com/yourname/repositoryname.git"
},
...
}
- 配置完成后就可以隨意安裝模塊了
npm install utility express lodash --save
--save 的作用,就是會在你安裝依賴的同時,自動把這些依賴寫入 package.json凄诞。命令執(zhí)行完成之后圆雁,查看 package.json,會發(fā)現(xiàn)多了一個 dependencies
字段
運(yùn)行
-
VS Code內(nèi)置調(diào)試器支持調(diào)試Node.js運(yùn)行時帆谍,同時也可以調(diào)試JavaScript伪朽、TypeScript以及其他JS轉(zhuǎn)譯語言。
點(diǎn)擊
圖標(biāo)來到調(diào)試界面
單擊調(diào)試視圖頂部欄中的齒輪圖標(biāo)汛蝙,并選擇好調(diào)試環(huán)境烈涮,VS Code會在.vscode目錄下為你生成一份launch.json。
- 來看launch.json
這里的program 設(shè)置的是啟動文件, index.js
- 此時回到文件界面, 按 F5 就可以運(yùn)行了
延伸:
NodeSchool(推薦)
Node.js 包教不包會
七天學(xué)會Node.js
參考:
VS Code 官方文檔
[譯]Visual Studio Code文檔其4—調(diào)試
vscodevscode 配置TypeScript開發(fā)node環(huán)境
npm模塊管理器