Windows Nodejs 安裝教程


Windows Nodejs 安裝教程

 

1: 訪問官方地址 https://nodejs.org/en/download/

 

 2: 解壓壓縮包文件到指定目錄

我直接把壓縮包解壓到C盤根目錄下,並將文件夾重命名為nodejs

 

3: 設置系統的環境變量

NODEJS_HOME  =  C:\nodejs

PATH 中追加 %NODEJS_HOME%

NODE_EXE = %NODEJS_HOME%\node.exe

NPM_CLI_JS = %NODEJS_HOME%\node_modules\npm\bin\npm-cli.js

 

在nodejs的主目錄下,創建 node_global 和 node_cache 兩個文件夾。

創建完兩個空文件夾之后,並設置環境變量。

NODE_GLOBAL = %NODEJS_HOME%\node_global

NODE_CACHE = %NODEJS_HOME%\node_cache

NODE_PATH = %NODE_GLOBAL%\node_modules

PATH 中追加 %NODE_GLOBAL%

 

打開cmd命令窗口,輸入

npm config set prefix C:\nodejs\node_global
npm config set cache C:\nodejs\node_cache

 

 

調整其他環境變量設置

GIT_FOR_WIN_HOME = C:\PortableGit

PATH 中追加 %GIT_FOR_WIN_HOME%;%GIT_FOR_WIN_HOME%\bin

 

4: 測試安裝npm擴展

npm install express -g

 

5: 前往淘寶鏡像官網 http://npm.taobao.org/,可查看安裝cnpm包的命令

在命令行輸入:
npm install -g cnpm --registry=https://registry.npm.taobao.org

 

Typings實現智能
在Visual Studio Code中通過Typings實現智能提示功能

我們知道在IDE中代碼的智能提示幾乎都是標配,雖然一些文本編輯器也有一些簡單的提示,但這是通過代碼片段提供的。功能上遠不能和IDE相比。不過最近興起的文本編輯器的新銳 Visual Studio Code 可以通過 Typings 來對 JavaScript 實現智能提示功能,對於一個文本編輯器來說,這點很難得。所以Visual Studio Code 特別適合用來編寫 JavaScript(Node.js)程序; 同時,如果我們需要編寫一些嘗試性的小代碼片段,例如:Lodash.js 某個函數的小Demo,因為我們不想研究一個函數的使用方式而去使用IDE新建一個項目,這時候Visual Studio Code 就是一個非常好的選擇,而且它同樣可以運行和調試 JavaScript 代碼(依賴於 Node.js),並且還包含非常方便的代碼提示功能。

從這點來說,我覺得Visual Studio Code 已經算得上是一個精悍的小型IDE了。

通過NPM安裝Typings

通過 NPM 我們可以很容易的安裝 Typings ,在命令行中輸入:

npm install -g typings

安裝完成后,在命令行中輸入:

typings --version

看到版本信息就表示 typings 工具安裝完成了:

 

NPM是和Node.js一起安裝的,如果你想使用NPM的話,那么你應該先安裝Node.js

安裝相關提示信息文件

安裝完成后,我們需要安裝相應的需要提示功能庫或者框架的類型信息文件,在這里我們新建一個文件夾 NodeSnippet,使用命令行進入到該目錄中,分別輸入下面兩個命令來安裝NodeLodash的類型接口信息文件:

typings install node --ambient --save typings install lodash --save

 

什么時候需要使用 --ambient 參數:  

  • 如果安裝的包使用script標記來引用(如jQuery)(也就是在瀏覽器中使用)
  • 這個包是屬於環境的一部分(如node)時
  • 該包沒有使用 --ambient 安裝失敗時

 

使用typings拓展自動補全功能

The answer is here: https://github.com/typings/typings/releases/tag/v1.0.0

TLDR: --ambient has changed to --global

UPDATE From comment below

You need to specify the repository too e.g.:

typings install dt~moment-timezone --global

 

typings install dt~node --global
typings install dt~express --global
typings install dt~lodash --global

typings install dt~express dt~serve-static dt~express-serve-static-core --global

 

關於typings的其他相關.

基本用法

語法復制自typings的Quick Start,個人對注釋本地化了一下。

# 安裝Typings的命令行代碼. npm install typings --global # 搜索對應模塊的typings定義. typings search tape # 根據名稱尋找一個可獲得的typings定義. typings search --name react # 如果你用一個獨立包的模塊: # 或者並不是安裝全局模塊 # 比如並不是在命令行通過輸入npm install -g typings這種方式安裝的. typings install debug --save # 如果是通過script標記 # 或者是子環境的一部分 # 或者全局typings命令不可用的時候: typings install dt~mocha --global --save # 從其他版本處安裝typings定義(比如env或者npm). typings install env~atom --global --save typings install npm~bluebird --save # 使用該文件`typings/index.d.ts` (在`tsconfig.json`文件使用或者用 `///` 定義). cat typings/index.d.ts

 

這時候我們可以看到我們的 NodeSnippet目錄中多了一些文件:

Typings Definition Files

這些文件就是為我們提供提示信息的類型類型文件(使用TypeScript定義)。查看Typings是否支持某個庫或框架的智能提示,我們可以使用下面的命令:

typings search exampleName

啟用智能提示功能

通過兩種方式來啟動提示功能:

  • 第一種是在需要進行智能提示的文件最上行增加提示信息文件所在目錄,格式如下:
/// <reference path="./typings/main.d.ts" />

啟用提示功能后我們就可以非常愉快的使用Visual Studio Code 為我們提供的智能提示功能了。如下所示:

IntelliSense VsCode

注意事項

Typings VS TSD

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

 npm rm -g tsd

使用 CNPM

在國內由於的原因,有時候使用NPM安裝模塊的速度上會很慢,這時候我們其實可以選擇國內淘寶的NPM鏡像,使用下面的命令來進行安裝:

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

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

cnpm install lodash 

可以看到除了cnpm替代了npm其他的並沒有任何區別。

參考&進一步閱讀

https://github.com/typings/typings
https://code.visualstudio.com/docs/languages/javascript
https://npm.taobao.org/

 

 

npm install 本地安裝與全局安裝的區別

npm的包安裝分為本地安裝(local)、全局安裝(global)兩種,從敲的命令行來看,差別只是有沒有-g而已,比如

npm install grunt # 本地安裝
npm install -g grunt-cli # 全局安裝

這兩種安裝方式有什么區別呢?從npm官方文檔的說明來看,主要區別在於(后面通過具體的例子來說明):
本地安裝
1. 將安裝包放在 ./node_modules 下(運行npm時所在的目錄)
2. 可以通過 require() 來引入本地安裝的包

全局安裝
1. 將安裝包放在 /usr/local 下
2. 可以直接在命令行里使用

本地安裝

1、將安裝包放在 ./node_modules 下(運行npm時所在的目錄)

比如運行下面命令

npm install grunt --save-dev

那么,就會在當前目錄下發現一個node_modules目錄,進去后能夠看到grunt這個包

casperchenMacBookPro:testUsemin casperchen$ ll
total 200
drwxr-xr-x  16 casperchen  staff   544B 12 14 23:17 node_modules

進入node_modules

casperchenMacBookPro:node_modules casperchen$ ll
total 0
drwxr-xr-x  16 casperchen  staff   544B 12  5 00:49 grunt

2、可以通過 require() 來引入本地安裝的包

直接來個例子,我們在項目根目錄下創建test.js,里面的內容很簡單

var grunt = require('grunt');grunt.log.writeln('hello grunt');

然后在控制台運行test.js

node test.js

然后就會看到如下輸出

casperchenMacBookPro:testUsemin casperchen$ node test.js 
hello grunt

全局安裝

1、將安裝包放在 /usr/local 下

運行如下命令

npm install -g grunt-cli

然后進入/usr/local/bin目錄,就會發現grunt-cli已經被放置在下面了

casperchenMacBookPro:bin casperchen$ pwd
/usr/local/bin
casperchenMacBookPro:bin casperchen$ ll grunt
lrwxr-xr-x  1 root  admin    39B  8 18 21:43 grunt -> ../lib/node_modules/grunt-cli/bin/grunt

可見,全局模塊的真實安裝路徑在/usr/local/lib/node_modules/下,/usr/local/bin下的可執行文件只是軟鏈接而已

2、可以直接在命令行里使用

實現細節在上面其實就講到了,通過在`/usr/local/bin下創建軟鏈接的方式實現。這里不贅述

更直觀的例子

下面就直接看下,當我們在項目目錄下運行grunt task(task為具體的grunt任務名,自行替換)時,發生了什么事情。這里要借助node-inspector。

首先,沒接觸過node-inspector的童鞋可以參考之前的文章了解下

運行如下命令開啟調試

node-inspector &

見到如下輸出

casperchenMacBookPro:tmp casperchen$ node-inspector &
[1] 14390
casperchenMacBookPro:tmp casperchen$ Node Inspector v0.6.1
   info  - socket.io started
Visit http://127.0.0.1:8080/debug?port=5858 to start debugging.

接着,在當前任務下運行grunt任務

^CcasperchenMacBookPro:testUsemin casperchen$ node --debug-brk $(which grunt) dev
debugger listening on port 5858

接着,打開chrome瀏覽器,輸入網址http://127.0.0.1:8080/debug?port=5858,就會自動進入斷點調試狀態。從一旁顯示的tiPS可以看到,全局命令grunt其實就是/usr/local/lib/node_modules/grunt-cli/bin/grunt

 

按下F8接着往下跑,就會進如Gruntfile.js,此時的grunt,是本地安裝的一個node包。全局命令跟本地的包名字一樣,挺有迷惑性的。

 

 

 

淘寶 NPM 鏡像  http://npm.taobao.org/

這是一個完整 npmjs.org 鏡像,你可以用此代替官方版本(只讀),同步頻率目前為 10分鍾 一次以保證盡量與官方服務同步。

575,943 個模塊 4,104,362 個模塊版本 11 次刪除
1,863,585 次本日下載 1,863,585 次本周下載 95,738,460 次本月下載
3,038,509 次昨日下載 24,241,361 次上周下載 118,008,975 次上月下載

同步狀態

This registry will sync all packages from official registry.

上次同步完成時間: Mon Oct 30 2017 14:24:51 GMT+0800 (中國標准時間)

 同步進程正在運行中...
共 47 個模塊需要同步 剩余 4 個模塊待同步 已完成 91%
已同步完成了 43 個模塊 其中 0 個模塊同步失敗 最近同步成功的模塊是: unlace

Version Badge

Default style is flat-square.

Badge URL: https://npm.taobao.org/badge/v/cnpmjs.org.svg cnpmjs.org-badge

  • <0.1.0 & >=0.0.0red-badge
  • <1.0.0 & >=0.1.0red-badge
  • >=1.0.0red-badge

使用說明

你可以使用我們定制的 cnpm (gzip 壓縮支持) 命令行工具代替默認的 npm:

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

或者你直接通過添加 npm 參數 alias 一個新命令:

alias cnpm="npm --registry=https://registry.npm.taobao.org \ --cache=$HOME/.npm/.cache/cnpm \ --disturl=https://npm.taobao.org/dist \ --userconfig=$HOME/.cnpmrc" # Or alias it in .bashrc or .zshrc $ echo '\n#alias for cnpm\nalias cnpm="npm --registry=https://registry.npm.taobao.org \ --cache=$HOME/.npm/.cache/cnpm \ --disturl=https://npm.taobao.org/dist \ --userconfig=$HOME/.cnpmrc"' >> ~/.zshrc && source ~/.zshrc

安裝模塊

從 registry.npm.taobao.org 安裝所有模塊. 當安裝的時候發現安裝的模塊還沒有同步過來, 淘寶 NPM 會自動在后台進行同步, 並且會讓你從官方 NPM registry.npmjs.org 進行安裝. 下次你再安裝這個模塊的時候, 就會直接從 淘寶 NPM 安裝了.

$ cnpm install [name]

同步模塊

直接通過 sync 命令馬上同步一個模塊, 只有 cnpm 命令行才有此功能:

$ cnpm sync connect

當然, 你可以直接通過 web 方式來同步: /sync/connect

$ open https://npm.taobao.org/sync/connect

其它命令

支持 npm 除了 publish 之外的所有命令, 如:

$ cnpm info connect

 


免責聲明!

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



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