起因:如果你覺得在npmscript里寫的太多,而且package.json里不好注釋
那可以把里面覺得一大坨的命令 寫進(jìn)js腳本 ,然后在node環(huán)境里執(zhí)行它們
回到大家都熟悉的node頓時感覺親切了不少.

初始時就需要兩個文件了 一個package.json 一個create.js
package.json
{
"name": "npm",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"css": "postcss -w css/*.css -d css-min",
"http": "lite-server",
"js": "uglifyjs js/*.js -m -c -o js-min/main.js",
"create": "node create.js"
},
"author": "",
"license": "ISC",
"devDependencies": {
"autoprefixer": "^7.2.1",
"cross-var": "^1.1.0",
"cssnano": "^3.10.0",
"filedir": "^1.0.1",
"lite-server": "^2.3.0",
"npm-run-all": "^4.1.2",
"postcss-cli": "^4.1.1",
"uglify-js": "^3.2.1"
},
"dependencies": {
"art-template": "^4.12.2"
}
}
create.js
// // 創(chuàng)建目錄,支持多級創(chuàng)建
// filedir.mkdir('D:/filedirTest');
// // 刪除文件或目錄
// filedir.del('D:/filedirTest');
// // 復(fù)制文件
// filedir.copy('D:/a.txt', 'D:/b.txt');
// // 讀文本文件
// var text = filedir.read('D:/filedirTest.txt');
// // 寫文本文件
// filedir.write('D:/filedir_write.txt', '0123456789');
// // JSON變量寫出到j(luò)son文件,若目錄不存在則自動創(chuàng)建
// filedir.writeJsonFile('D:/filedir_write.txt', {Color:'Blue'});
// // 判斷文件或目錄是否存在
// filedir.isExist('D:/filedir_write.txt');
// // 判斷是不是一個已存在的文件
// filedir.isFile('D:/filedirTest');
// // 判斷是不是一個已存在的目錄
// filedir.isDir('D:/filedirTest');
var http = require('https')
var filedir=require("filedir");
var jquery_url="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"
function get_js(url,address){
http.get(url, function (response) {
response.setEncoding('binary'); //二進(jìn)制binary
var Data = '';
response.on('data', function (data) { //加載到內(nèi)存
Data += data;
}).on('end', function () { //加載完
filedir.write(address, Data );
})
})
}
//
function get_arttemplate(){
var arttemplate = filedir.read('./node_modules/art-template/lib/template-web.js')
filedir.write('./js/arttemplate.js',arttemplate)
}
if(!filedir.isDir('./css')&&!filedir.isFile("./css/main.css")){
filedir.mkdir("./css");
filedir.write("./css/main.css",
"*{padding:0;margin:0};"+
"a{text-decoration:none};ul,ol{list-style:none}"+
"img{border:none}"+
"br{font-size:0;line-height:0;clear:both}"
)
}
if(!filedir.isDir("./js")&&!filedir.isFile("./js/jquery.js")){
filedir.mkdir("./js");
get_js(jquery_url,"./js/jquery.js")
}
if(filedir.isDir("./js")&&!filedir.isFile("./js/jquery.js")){
get_js(jquery_url,"./js/jquery.js")
}
if(!filedir.isDir("./js")&&!filedir.isFile("./js/arttemplate.js")){
filedir.mkdir("./js");
get_arttemplate()
}
if(filedir.isDir("./js")&&!filedir.isFile("./js/arttemplate.js")){
get_arttemplate()
}
if(!filedir.isDir("./images")){
filedir.mkdir("./images")
}
if(!filedir.isDir("./css-min")){
filedir.mkdir("./css-min")
}
if(!filedir.isDir("./js-min")){
filedir.mkdir("./js-min")
}
if(!filedir.isFile("./index.html")){
filedir.write("./index.html","")
}
if(!filedir.isFile("./postcss.config.js")){
filedir.write("./postcss.config.js","module.exports = {plugins: [require('autoprefixer'),require('cssnano')({preset: 'default' }),],}")
}
步驟一 還是把兩個文件放進(jìn)你的某個文件夾 然后npm-install
步驟二 執(zhí)行npm run create 構(gòu)建項(xiàng)目
步驟三 執(zhí)行npm run http 建立靜態(tài)資源服務(wù)器 實(shí)現(xiàn)實(shí)時刷新
步驟四 執(zhí)行npm run css 實(shí)現(xiàn)postcss實(shí)時輸出進(jìn)css-min文件夾 并自動加前綴
步驟五 上線前可執(zhí)行 npm run js 會壓縮js文件夾里所有的js 合成一個main.js
OK 就是這些