環境篇
1、安裝Node.js
官網下載:https://nodejs.org/en/ (選擇LTS那個)
下載完后,傻瓜式安裝(一直下一步)
配置環境變量,在path中寫入安裝地址(我的安裝路徑是C:\Program Files\nodejs\),安裝后默認配置好了
配置npm在安裝全局模塊時的路徑和緩存cache的路徑
因為在執行例如npm install webpack -g等命令全局安裝的時候,默認會將模塊安裝在C:\Users\用戶名\AppData\Roaming路徑下的npm和npm_cache如下圖所示
所以這里配置自定義的全局模塊安裝目錄,在node.js安裝目錄下新建兩個文件夾 node_global和node_cache,然后在cmd命令下執行如下兩個命令:
npm config set prefix "C:\Program Files\nodejs\node_global"
npm config set cache "C:\Program Files\nodejs\node_cache"
執行成功。然后在環境變量 -> 系統變量中新建一個變量名為 “NODE_PATH”, 值為“C:\Program Files\nodejs\node_modules”,如下圖:
最后編輯用戶變量里的Path,將相應npm的路徑改為:D:\Program Files\nodejs\node_global,如下:
更改前:
更改后
配置完成
測試下:
在cmd命令下執行 npm install webpack -g 然后安裝成功后可以看到自定義的兩個文件夾已生效:
2、配置淘寶鏡像
在nodejs目錄下執行命令
npm install -g cnpm --registry=https:
//registry.npm.taobao.org
配置失敗報錯時,
1、刪除用戶目錄下的該文件,如圖
2、執行清理命令:npm cache clean --force
重新執行
配置taobao倉庫:npm config set registry https:
//registry.npm.taobao.org
pm config list //查看基本配置
npm config list -l //查看所有配置
npm本地安裝與全局安裝有什么區別?
npm install grunt // 本地安裝,則是將模塊下載到當前命令行所在目錄。
npm install -g grunt//全局安裝,模塊將被下載安裝到【全局目錄】中;
npm如何獲取全局安裝的默認目錄?
npm config get prefix
npm如何設置全局安裝的默認目錄?
npm config set prefix “directory”
3、使用 vue-cli + element-ui 快速搭建項目
① 使用 git 命令git clone https://github.com/ElementUI/element-starter.git
下載官方提供的模板
(本地電腦沒有安裝 git 的可以進入 https://github.com/ElementUI/element-starter ,點擊綠色的 Clone or download 按鈕,點擊 Download ZIP 下載模板)
② 在項目根目錄下使用cnpm intsall
下載依賴的模塊(沒有淘寶鏡像 cnpm 可以使用npm install
)
③ 在項目根目錄下使用npm run dev
跑項目
pm config list //查看基本配置
npm config list -l //查看所有配置
npm本地安裝與全局安裝有什么區別?
npm install grunt // 本地安裝,則是將模塊下載到當前命令行所在目錄。
npm install -g grunt//全局安裝,模塊將被下載安裝到【全局目錄】中;
npm如何獲取全局安裝的默認目錄?
npm config get prefix
npm如何設置全局安裝的默認目錄?
npm config set prefix “directory”