1. 程式人生 > >npm run 執行多工的package json配置

npm run 執行多工的package json配置

分享一下我老師大神的人工智慧教程!零基礎,通俗易懂!http://blog.csdn.net/jiangjunshow

也歡迎大家轉載本篇文章。分享知識,造福人民,實現我們中華民族偉大復興!

               
有時需要在執行npm run時,執行多個自定義的任務,此時可以使用增加scripts中條目,然後用一個總任務指令碼將相關條目用&&串聯起來的方式進行。我們知道:在package.json中
,scripts裡的條目可使用:npm run XXX(指令碼關鍵字)來自動執行。通常情況下,我們在生產環境下,只需執行npm run build。如是本地開發,就用npm run watch。比如在package.json中:
{  "main": "index.html",  "scripts": {    "test": "echo \"Error: no test specified\" && exit 1",    "dev": "webpack-dev-server --inline --hot",    "build": "webpack -p"  },  "author": "Johnson Ju <
[email protected]
>",  "license": "MIT",  "devDependencies": {……  },  "dependencies": {    "vuetable": "git://github.com/ratiw/vue-table.git#develop"  }}
其中:
在"scripts": {...}條目裡有一句:
"build": "webpack -p",使用webpack打包。
但有時一個build條目可能無法滿足我們執行多工的需求。怎麼辦呢?
我們可以分解任務來執行:
比如: "build-js"和 "build-css",分別類似這樣子的:
"build-js": "browserify browser/main.js | uglifyjs -mc > static/bundle.js",
 "build-css": "cat static/pages/*.css tabs/*/*.css",然後,通過另一條指令碼將上面串聯起來(注意中間用了“&&” 連線): "build": "npm run build-js && npm run build-css",
事實上,scripts中的條目都可以使用命令列:npm run XXX(指令碼關鍵字)來執行。
所以,通過上述方式,執行一次
npm run build 即可將 build-js和build-css任務同時自動完成了。
同理,watch, start,test均可如法炮製。最後的
{  "main": "index.html",
   "scripts": { "build-js": "browserify browser/main.js | uglifyjs -mc > static/bundle.js",  "build-css": "cat static/pages/*.css tabs/*/*.css", "build": "npm run build-js && npm run build-css", "watch-js": "watchify browser/main.js -o static/bundle.js -dv", "watch-css": "catw static/pages/*.css tabs/*/*.css -o static/bundle.css -v", "watch": "npm run watch-js & npm run watch-css", "start": "node server.js", "test": "tap test/*.js"  },  "author": "Johnson Ju <[email protected]>",  "license": "MIT",  "devDependencies": {……  },  "dependencies": {    "vuetable": "git://github.com/ratiw/vue-table.git#develop"  }}
           

給我老師的人工智慧教程打call!http://blog.csdn.net/jiangjunshow

這裡寫圖片描述