Node 的使用

Node 使用

npm 經常使用命令

npm config list 查看node的配置環境(npm config list/ls)

npm config list/ls -l 更詳細

npm install xxx 安裝模塊

npm install xxx -g 將模塊安裝到全局環境中

npm i/install --save xxx 安裝包信息將加入到dependencies（生產階段的依賴）

npm i/install --save-dev xxx 安裝包信息將加入到devDependencies（開發階段的依賴），因此開發階段通常使用它

npm i --save-exact xxx 精確安裝包版本，package.json裏的依賴包的value是具體的版本號，前邊沒有符號

npm root 查看包的安裝路徑,及node_modules的路徑

npm ls 查看安裝的模塊及依賴

npm ls -g 查看全局安裝的模塊及依賴

npm uninstall xxx (-g) 卸載模塊

npm cache clean (舊版)清理緩存 或 （新版） npm cache verify

sudo npm install npm -g //更新npm

npm config get prefix 找到npm目錄的路徑

sudo chown -R whoami <directory> 修復權限到 npm's 默認目錄

npm view modulename 查看模塊的package.json信息

npm view moudleName dependencies 查看包的依賴關係

npm view moduleName repository.url 查看包的源文件地址

npm view moduleName engines 查看包所依賴的node版本

npm outdated 檢測顯示過期的包

npm update 更新包

npm uninstall 卸載包

npm init 在項目中引導建立一個package.json文件

向npm run xx傳入參數必須用--代表

$npm run xx & npm run xxx同時並行執行

$npm run xx && npm run xxx 前一個執行成功，再執行最後一個

{
    "scripts":{
        "build:dev":"xxxx",//npm run build:dev
        "build:prod":"xxx"//npm run build:prod
    }
}

如何用 npm 同時執行兩條監聽命令？

須要安裝 concurrently: npm install -g concurrently

以下圖修改package.json的 scripts:

"command1":"hahaha", "command2":"xixixi", "test":"concurrently \"npm run command1\" \"npm run command2\""

經常使用腳本示例

// 刪除目錄 "clean": "rimraf dist/*", // 本地搭建一個 HTTP 服務 "serve": "http-server -p 9090 dist/", // 打開瀏覽器 "open:dev": "opener http://localhost:9090", // 實時刷新 "livereload": "live-reload --port 9091 dist/", // 構建 HTML 文件 "build:html": "jade index.jade > dist/index.html", // 只要 CSS 文件有變更，就從新執行構建 "watch:css": "watch 'npm run build:css' assets/styles/", // 只要 HTML 文件有變更，就從新執行構建 "watch:html": "watch 'npm run build:html' assets/html", // 部署到 Amazon S3 "deploy:prod": "s3-cli sync ./dist/ s3://example-com/prod-site/", // 構建 favicon "build:favicon": "node scripts/favicon.js",

linux環境下：

mkdir ~/npm-global 建立目錄

npm config set prefix '~/npm-global' 設置切換node的路徑

export PATH=~/npm-global/bin:$PATH 設置環境變量，而後 source ~/.profile

npm outdated 查看過時包

npm outdated -g --depth=0 查找過時包

npm update --dev --save -d 查看過時包

• --dev 同時更新devDependencies內容
• --save 把更新狀況保存到package.json
• -d 查看細節

npm update -g 更新全部全局包

npm uninstall lodash(<package>)從 node_modules 目錄刪除包命令 npm uninstall <package>

npm uninstall --save lodash去除package.json依賴關係, 須要save標籤

npm uninstall -g <package> 卸載全局包命令

npm install -g <package> 安裝全局包命令,若是有訪問權限錯誤, 使用sudo修改權限: sudo npm install -g <package>

windows系統下npm 全局安裝路徑問題

安裝了nodejs以後，npm的路徑默認一直都是appData,表示很討厭，因而嘗試修改在安裝目錄（D盤空間很大啊）

安裝目錄：D:\program files\nodejs

1、在nodejs下新建兩個文件夾(和node_modules同級)：

　　node_global和node_cache

2、cmd設置(引號必需要)：

　　npm config set cache "D:\nodejs\node_cache"

　　npm config set prefix "D:\nodejs\node_global"

3、更改配置文件.npmrc(D:\program files\nodejs\node_modules\npm)：

　　prefix=D:\program files\nodejs\node_global 　　cache=D:\program files\nodejs\node_cache

cache = "E:\\nodejs\\node_cache"
prefix = "E:\\nodejs\\node_global"

若是不用的話，能夠刪除對應的key 便可：npm config delete prefix(key)

若出現相似這樣的錯誤：Error: node-sass@4.5.0 postinstall: 'node scripts/build.js'

在.npmc添加sass_binary_site=https://npm.taobao.org/mirrors/node-sass/

參考：https://segmentfault.com/a/1190000005921721

Webstorm 配置tslint,先安裝tslint:npm install -g tslint typescript

4、測試是否成功：

　　

　　成功啦~~~安裝路徑是本身剛剛設置的那個

ps:目前沒有設置環境變量，之後有須要再補吧

tsconfig.json

有幾個重要的屬性須要解釋一下：

target：編譯以後生成的JavaScript文件須要遵循的標準。有三個候選項：es三、es五、es2015。

noImplicitAny：爲false時，若是編譯器沒法根據變量的使用來判斷類型時，將用any類型代替。爲true時，將進行強類型檢查，沒法推斷類型時，提示錯誤。

module：遵循的JavaScript模塊規範。主要的候選項有：commonjs、AMD和es2015。爲了後面與node.js保持一致，咱們這裏選用commonjs。

removeComments：編譯生成的JavaScript文件是否移除註釋。

sourceMap：編譯時是否生成對應的source map文件。這個文件主要用於前端調試。當前端js文件被壓縮引用後，出錯時可藉助同名的source map文件查找源文件中錯誤位置。

outDir：編譯輸出JavaScript文件存放的文件夾。

include、exclude：編譯時須要包含/剔除的文件夾。

推薦使用淘寶的鏡像cnpm

這裏特別推薦使用淘寶的鏡像cnpm，記得之後把npm的指令改成cnpm就能夠了

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

安裝全局Angular cli

cnpm install -g @angular/cli

若出現相似這樣的Installing packages for tooling via npm.這裏若是你選這了淘寶的cnmp鏡像，應該最好在安裝徹底局Angular cli後設置一下，保證正常下載工具

ng set --global packageManager = cnpm