最近前端同學使用最多的莫過於vue,angualr,react等熱門前端框架了。那么就避免不掉的使用npm命令,本人就經常因為這三個腳手架的使用而不得不百度相應的npm命令,
不勝其煩,,,因此就整理一下常用的npm命令,方便后面查閱
一:npm命令
1.使用模塊
1.1 安裝模塊
其中:
npm install xxx --save 簡寫為 npm i -S
npm install xxx --save-dev 簡寫為 npm i -D
1.2 卸載模塊
npm uninstall -g xxx 簡寫 npm u -g xxx 全局模塊卸載(存儲在nodeJs安裝目錄下)
npm uninstall xxx 簡寫 npm u xxx 項目模塊卸載
1.3 更新模塊
更新全局包: npm update <name> -g
更新生產環境依賴包: npm update <name> --save
更新開發環境依賴包: npm update <name> --save-dev
使用工具工具更新:
npm-check檢查更新
npm install -g npm-check
npm-check
npm-upgrade更新 npm install -g npm-upgrade
npm-upgrade
2.查看安裝模塊
查看當前項目的依賴模塊如下:
npm ls --depth 0
查看全局依賴模塊命令如下:
npm ls -g --depth 0
npm ls命令可以查看安裝過的模塊,這個命令使用的時候要注意是否為全局和注意層數。
3.使用淘寶鏡像
由於npm下載資源在國外,可能導致下載過慢,因此可以使用淘寶鏡像,下載相應的國內資源
安裝cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
使用cnpm
cnpm install xxx
二:腳手架的使用
注:
隨着腳手架更新,cli(命令)可能會有所變化
安裝腳手架中帶有@符號時 需要先切換到cmd(powershell不識別@)
1.安裝react腳手架
npm install -g create-react-app
react腳手架生成項目:create-react-app my-app
啟動項目:npm run start
2.安裝vue2.x腳手架
npm install -g vue-cli
vue2.0腳手架生成項目:vue init webpack my-project
啟動項目:npm run dev
3.安裝vue3.x腳手架
npm install -g @vue/cli
vue3.0腳手架生成項目:vue create my-project
啟動項目:npm run dev
4.安裝angular4.x腳手架
npm install -g @angular/cli
angular4.0腳手架生成項目:ng new my-project
啟動項目:ng serve [--open]
其他
ctrl+c 停止正在啟動的服務