实例详解带参数的 npm script


Posted in Javascript onMay 28, 2019

添加参数可以减少重复的 npm script。拿 eslint 来说,传入 --fix 参数,就开启内置的代码风格自动修复模式,好智能听起来。

"scripts": {
  ...,
  "lint:js": "eslint ./src/**/*.js",
  "lint:js:fix": "eslint ./src/**/*.js --fix"
}

本着不 DRY 的原则,而且还会遇上复制粘贴带来的风险,可以这么巧妙的配置:

"scripts": {
  ...,
  "lint:js": "eslint ./src/**/*.js",
  "lint:js:fix": "npm run lint:js -- --fix"
}

对面个上面命令配置, --fix 前面添加了 -- , -- 是分隔符,意思就是给 npm run lint:js 添加额外的参数。

这个时候看看你的代码,你会发现一些代码风格就自动修复了。

添加注释

随着命令配置越来越多,添加注释势在必行,以保障代码的可读性和维护性。

在 package.json 中添加 // 为键的值

"scripts": {
  ...,
  "//": "并行检查所有代码编程风格",
  "lint:bx-all": "npm-run-all --parallel lint:*"
}

添加 // 的方式明显有不足,npm run 不能将注释和命令对应上,且只会列出最后那个。

直接在脚本命令中编辑加注释

"scripts": {
  ...,
  "lint-bx-all": "# 并行检查所有代码编程风格 \n npm-run-all --parallel lint:*"
}

注意 \n 后面有空格,主要是为了排版(换行或缩进)美观,当然了也可以用 \t 。

运行时日志

默认日志

不添加任何参数控制日志输出,也是最常用的,可以看到执行命令和执行命令的结果。

更简洁的日志 -s

搭配 --loglevel silent 或 --silent 或 -s 参数来控制日志输出,

不简洁的日志 -d

使用场景多在排查脚本问题的时候可用,搭配 --loglevel verbose 或 --verbose 或 -d (本来以为是 -v ,估计是 -v 是 version)

总结

以上所述是小编给大家介绍的带参数的 npm script,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
JS BASE64编码 window.atob(), window.btoa()
Mar 09 Javascript
JavaScript 异步调用框架 (Part 2 - 用例设计)
Aug 03 Javascript
Javascript 按位与运算符 (&)使用介绍
Feb 04 Javascript
js函数内变量的作用域分析
Jan 12 Javascript
javascript实现计时器的简单方法
Feb 21 Javascript
Vue.js实现在下拉列表区域外点击即可关闭下拉列表的功能(自定义下拉列表)
May 30 Javascript
自制简易打赏功能的实例
Sep 02 Javascript
微信小程序实现刷脸登录
May 25 Javascript
layui 弹出层回调获取弹出层数据的例子
Sep 02 Javascript
Vue实例的对象参数options的几个常用选项详解
Nov 08 Javascript
vue-cli 关闭热更新操作
Sep 18 Javascript
解决vue init webpack 下载依赖卡住不动的问题
Nov 09 Javascript
jquery实现Ajax请求的几种常见方式总结
May 28 #jQuery
Vue2.x通用条件搜索组件的封装及应用详解
May 28 #Javascript
jquery操作select常见方法大全【7种情况】
May 28 #jQuery
vue实现条件叠加搜索的解决方法
May 28 #Javascript
webpack4 从零学习常用配置(小结)
May 28 #Javascript
详解ES6 export default 和 import语句中的解构赋值
May 28 #Javascript
jQuery实现高级检索功能
May 28 #jQuery
You might like
通过dbi使用perl连接mysql数据库的方法
2014/04/16 PHP
php模拟post提交数据的方法
2015/02/12 PHP
开启PHP的伪静态模式
2015/12/31 PHP
Yii框架批量插入数据扩展类的简单实现方法
2017/05/23 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
通过PHP的Wrapper无缝迁移原有项目到新服务的实现方法
2020/04/02 PHP
js动态创建、删除表格示例代码
2013/08/07 Javascript
利用js实现在浏览器状态栏显示访问者在本页停留的时间
2013/12/29 Javascript
js 事件截取enter按键页面提交事件示例代码
2014/03/04 Javascript
jQuery中fadeOut()方法用法实例
2014/12/24 Javascript
JQuery中$.each 和$(selector).each()的区别详解
2015/03/13 Javascript
JS实现css hover操作的方法示例
2017/04/07 Javascript
JQuery EasyUI的一些常用组件
2017/07/12 jQuery
React/Redux应用使用Async/Await的方法
2017/11/16 Javascript
浅谈JsonObject中的key-value数据解析排序问题
2017/12/06 Javascript
百度小程序之间的页面通信过程详解
2019/07/18 Javascript
jQuery 选择方法及$(this)用法实例分析
2020/05/19 jQuery
python实现一次创建多级目录的方法
2015/05/15 Python
Python基于生成器迭代实现的八皇后问题示例
2018/05/23 Python
对pandas数据判断是否为NaN值的方法详解
2018/11/06 Python
老生常谈python中的重载
2018/11/11 Python
如何用C代码给Python写扩展库(Cython)
2019/05/17 Python
django mysql数据库及图片上传接口详解
2019/07/18 Python
python爬虫 基于requests模块发起ajax的get请求实现解析
2019/08/20 Python
Python字符串中添加、插入特定字符的方法
2019/09/10 Python
Python3常用内置方法代码实例
2019/11/18 Python
python 实现dict转json并保存文件
2019/12/05 Python
TensorFlow命名空间和TensorBoard图节点实例
2020/01/23 Python
通过Django Admin+HttpRunner1.5.6实现简易接口测试平台
2020/11/11 Python
利用Python函数实现一个万历表完整示例
2021/01/23 Python
美国珠宝精品店:Opulent Jewelers
2019/08/20 全球购物
香港零食网购:上仓胃子
2020/06/08 全球购物
C和C++经典笔试题附答案解析
2014/08/18 面试题
办公室人员先进事迹
2014/01/27 职场文书
关爱女孩行动实施方案
2014/03/13 职场文书
学习党章心得体会2016
2016/01/15 职场文书