前置條件
1.Node 環(huán)境
2.npm Node.js的包管理工具(package manager)
3.cnpm 淘寶鏡像包(npm install cnpm -g --registry=https://registry.npm.taobao.org)
當(dāng)你使用npm命令下載包的報(bào)錯(cuò)的時(shí)候cnpm或許是你更好的選擇哦湿镀!
開始
使用之前可以參考 webpack中文官網(wǎng)地址谬莹,了解webpack概念及安裝過程河绽。
1.更改 Node 環(huán)境變量地址
環(huán)境變量原地址:
node安裝目錄
如:
以上配置當(dāng)你安裝webpack之后會安裝到用戶目錄下悄谐,無法全局使用下愈,即使你選擇的是按照模式是全局按照:
npm install webpack -g
所以我們要先配置好全局目錄,廢話不多說開始創(chuàng)建我們的node全局緩存目錄和全局引用目錄:
cd node安裝目錄
md node_cache
md node_global
npm config set cache "node安裝目錄\node_cache"
npm config set prefix "node安裝目錄\node_global"
npm config 命令可以自行在cmd命令行查看。然后就是修改環(huán)境變量地址:
2.安裝webpack
以下步驟可以直接參考官網(wǎng)安裝。
本人安裝選擇的全局安裝骄酗,本機(jī)環(huán)境都可使用,開始吧悦冀。
cnpm install webpack -g
cnpm install webpack-cli -g
安裝webpack和webpack-cli趋翻,我選擇的cnpm,如果你的環(huán)境npm安裝報(bào)錯(cuò)你也可以使用cnpm盒蟆,大家自行選擇嘿歌。
安裝完成之后打開cmd輸入以下命令,查看是否安裝成功:
webpack -v
webpack-cli -v
任意目錄執(zhí)行都可查看到webpack版本說明全局安裝成功茁影,同時(shí)也可以打開第一步創(chuàng)建的文件夾node_global,會發(fā)現(xiàn)webpack.cmd和webpack-cli.cmd丧凤。
最后募闲,小伙伴就可以使用webpack來構(gòu)建自己的項(xiàng)目了。