二、npm scripts
一、执行原理
安装npm 包,会将其package.json bin 字段添加到node_modules bin 里面,创建对应的.cmd文件,因此:
例如:
"scripts":{
"test": "mocha"
}
npm run test => 等同于
./node_modules/.bin/mocha
然后:
依旧是通过node 调用包bin字段对应的文件
bin 文件第一行 #!/usr/bin/env node
二、传入参数
"scripts":{
"test": "mocha --reporter spec"
}
在 shell 中传入的参数都要使用 -- 隔开,这个 -- 被视作 npm run 命令参数的结束,-- 后面的内容都会原封不动地传给运行的命令。
三、通配符
"lint": "jshint *.js"
"lint": "jshint **/*.js"
*表示任意文件名,**表示任意一层子目录。
四、执行顺序
1.并行
$ npm run script1.js & npm run script2.js
继发执行(即只有前一个任务成功,才执行下一个任务
$ npm run script1.js && npm run script2.js
五、变量
npm 脚本有一个非常强大的功能,就是可以使用 npm 的内部变量。
{
"name": "foo",
"version": "1.2.5",
"scripts": {
"view": "node view.js"
}
}
// view.js
console.log(process.env.npm_package_name); // foo
console.log(process.env.npm_package_version); // 1.2.5
六、常用脚本
// 删除目录
"clean": "rimraf dist/*",
// 本地搭建一个 HTTP 服务
"serve": "http-server -p 9090 dist/",
// 打开浏览器
"open:dev": "opener http://localhost:9090",
// 实时刷新
"livereload": "live-reload --port 9091 dist/",
// 构建 HTML 文件
"build:html": "jade index.jade > dist/index.html",
// 只要 CSS 文件有变动,就重新执行构建
"watch:css": "watch 'npm run build:css' assets/styles/",
// 只要 HTML 文件有变动,就重新执行构建
"watch:html": "watch 'npm run build:html' assets/html",
// 部署到 Amazon S3
"deploy:prod": "s3-cli sync ./dist/ s3://example-com/prod-site/",
// 构建 favicon
"build:favicon": "node scripts/favicon.js",
参考:
npm scripts 使用指南
为什么使用 npm Scripts 构建项目
npm script 用法详解
二、npm scripts的更多相关文章
- npm scripts 助力前端开发,实时刷新浏览器
用browser-sync或者lite-server来监控文件的改变,当文件改变时,就自动刷新浏览器. 用node-sass来实时编译scss文件. 用parallelshell来异步执行npm sc ...
- npm scripts 使用指南
转载自:http://www.ruanyifeng.com/blog/2016/10/npm_scripts.html Node 开发离不开 npm,而脚本功能是 npm 最强大.最常用的功能之一. ...
- npm scripts 脚本基础指南
什么是npm脚本? npm 允许在package.json文件里面,使用scripts字段定义脚本命令. 初始化package.json -> npm init -> 经历一系列的问答即可 ...
- npm Scripts使用教程【译】
Why npm Scripts? 原文发表于 2016.2.12,原文地址: https://css-tricks.com/why-npm-scripts/ 以下是访客Damon Bauer发布的一篇 ...
- npm scripts + webpack 实践经验(React、Nodejs)
最近用Webpack+npm scripts+Mongodb+Nodejs+React写了个后台项目,在用Webpack构建过程中遇到了许多坑,就写出来分享一下. 构建工具五花八门,想当年刚学会Gru ...
- windows下npm scripts不能执行的问题
最近在学webpack为了方便把运行脚本写入package.json文件中,如下: "scripts": { "start": "webpack-de ...
- 5.npm scripts 使用指南
简单介绍 scripts里面的 "start": "node app" npm run start 相当于 node app { "name" ...
- 我为何放弃Gulp与Grunt,转投npm scripts(上)
本文来源于我在InfoQ中文站翻译的文章.原文地址是:http://www.infoq.com/cn/news/2016/02/gulp-grunt-npm-scripts-part1 Cory Ho ...
- NPM Scripts 2 -- rimraf copyfiles imagemin usemin htmlmin uglifyjs
NPM Scripts Part 2 Objectives and Outcomes In this exercise you will learn to build a distribution f ...
随机推荐
- vue原理简介
写vue也有一段时间了,对vue的底层原理虽然有一些了解,这里总结一下. vue.js中有两个核心功能:响应式数据绑定,组件系统.主流的mvc框架都实现了单向数据绑定,而双向绑定无非是在单向绑定基础上 ...
- eclipse使用CXF3.1.*创建webservice服务端客户端以及客户端手机APP(二)
eclipse使用CXF3.1.*创建webservice服务端客户端以及客户端手机APP(二) 接上篇博客,本篇博客主要包含两个内容: 4.使用Android studio创建webservice客 ...
- spring简述
1. 什么是Spring Spring:SE/EE开发的一站式框架.(有EE开发每一层的解决方案) WEB层:SpringMVC Service层:Spring的Bean管理,Spring的声明式事务 ...
- 设计模式のAdapterPattern(适配器模式)----结构模式
一.产生背景 这种模式涉及到一个单一的类,该类负责加入独立的或不兼容的接口功能.举个真实的例子,读卡器是作为内存卡和笔记本之间的适配器.您将内存卡插入读卡器,再将读卡器插入笔记本,这样就可以通过笔记本 ...
- Error response from daemon: rpc error: code = Unknown desc = name conflicts with
环境:centos7 执行一下命令时, docker service create --mode global --name logspout gliderlabs/logspout 出现以下报错: ...
- JavaScript对象数组根据某属性sort升降序排序
1.自定义一个比较器,其参数为待排序的属性. 2.将带参数的比较器传入sort(). var data = [ {name: "Bruce", age: 23, id: 16 ...
- Ribbon - WeightedResponseTimeRule原理
根据响应时间计算权重,响应越长,权重越低,权重越低的服务器,被选择的可能性就越低 //定时统计权重serverWeightTimer.schedule(new DynamicServerWeightT ...
- ubuntu18.04 pip换源 永久修改
1. 创建pip.conf文件 cd ~/.pip 如果提示目录不存在的话,我们要自行创建一个,再进入目录 mkdir ~/.pip cd ~/.pip 在.pip目录下创建一个pip.conf文件 ...
- 微信硬件平台(八) 3-0ESP8266向微信服务器请求设备绑定的用户
1调试助手 请求URL: https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=自己微信ID&a ...
- 图解HTTP,TCP,IP,MAC的关系
入门 用户发了一个HTTP的请求,想要访问我们网站的首页,这个HTTP请求被放在一个TCP报文中,再被放到一个IP数据报中,最终的目的地就是我们的115.39.19.22. 进阶 IP数据报其实是通过 ...