1:安裝node.js 安裝方式:https://www.runoob.com/nodejs/nodejs-install-setup.html
安裝完后打開cmd, 輸入:node -v
2:安裝淘寶鏡像(npm太慢,改用淘寶鏡像下載速度更快灾常,之后安裝命令改為cnpm)
npm install -g cnpm --registry=https://registry.npm.taobao.org
3:全局安裝gulp
cnpm install --global gulp
如果沒有全局安裝在打包的時(shí)會(huì)出現(xiàn)以下情況华临,當(dāng)然可以修改環(huán)境變量解決(更復(fù)雜)
4:進(jìn)入我們的layui后臺(tái)管理項(xiàng)目像屋,已經(jīng)存在gulpfile.js和package.json毕箍,不需要進(jìn)行添加了,或者自行添加也行(方式:想創(chuàng)建package.json 值骇,運(yùn)行 cnpm init, 不過這種方式添加的依賴會(huì)很多移国,我們只需要gulp打包的即可)
5:在項(xiàng)目中安裝gulp
cnpm install --save-dev gulp
安裝完后項(xiàng)目會(huì)出現(xiàn)一個(gè)node_modules文件夾(里面都是第三方依賴庫)
6:打包項(xiàng)目吱瘩,直接在控制臺(tái)運(yùn)行 gulp 即可,如過報(bào)錯(cuò)如下
報(bào)錯(cuò)提示說沒有安裝gulp-minify-css 模塊我們只需要在控制臺(tái)輸入:cnpm install gulp-minify-css --save-dev迹缀,在當(dāng)前項(xiàng)目安裝這個(gè)模塊
直到打包成功提示如下:
注:部署的時(shí)候?qū)tart下面的index.html文件改為注釋的內(nèi)容即可使碾,同時(shí)之后部署的時(shí)候僅需要上傳dist文件夾,src不需要上傳