实例详解带参数的 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实现数组去重、判断数组以及对象中的内容是否相同
Nov 29 Javascript
js window.open弹出新的网页窗口
Jan 16 Javascript
深入理解JavaScript系列(47):对象创建模式(上篇)
Mar 04 Javascript
js实现input密码框提示信息的方法(附html5实现方法)
Jan 14 Javascript
改变checkbox默认选中状态及取值的实现代码
May 26 Javascript
Es6 写的文件import 起来解决方案详解
Dec 13 Javascript
使用jQuery卸载全部事件的思路详解
Apr 03 jQuery
JQuery 封装 Ajax 常用方法(推荐)
May 21 jQuery
JS计算输出100元钱买100只鸡问题的解决方法
Jan 04 Javascript
详解Vue基于vue-quill-editor富文本编辑器使用心得
Jan 03 Javascript
Vue.js轮播图走马灯代码实例(全)
May 08 Javascript
详解React 条件渲染
Jul 08 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
php 删除数组元素
2009/01/16 PHP
PHP批量上传图片的具体实现方法介绍.
2014/02/26 PHP
ThinkPHP3.1新特性之内容解析输出详解
2014/06/19 PHP
PHP中header用法小结
2016/05/23 PHP
PHP基于PDO调用sqlserver存储过程通用方法【基于Yii框架】
2017/10/07 PHP
Jquery replace 字符替换实现代码
2010/12/02 Javascript
Colortip基于jquery的信息提示框插件在IE6下面的显示问题修正方法
2010/12/06 Javascript
JS获取页面input控件中所有text控件并追加样式属性
2013/02/25 Javascript
JS获取月的最后一天与JS得到一个月份最大天数的实例代码
2013/12/16 Javascript
jQuery获得指定元素坐标的方法
2015/04/14 Javascript
jQuery拖动布局其结果保存到数据库
2015/10/09 Javascript
jQuery实现选项卡切换效果简单演示
2015/12/09 Javascript
基于Turn.js 实现翻书效果实例解析
2016/06/20 Javascript
JavaScript基础重点(必看)
2016/07/09 Javascript
AngularJS 实现JavaScript 动画效果详解
2016/09/08 Javascript
JSON与String互转的实现方法(Javascript)
2016/09/27 Javascript
利用iscroll4实现轮播图效果实例代码
2017/01/11 Javascript
canvas绘制万花筒效果(代码分享)
2017/01/20 Javascript
详解react如何在组件中获取路由参数
2017/06/15 Javascript
JavaScript门面模式详解
2017/10/19 Javascript
使用vue for时为什么要key【推荐】
2019/07/11 Javascript
JavaScript函数重载操作实例浅析
2020/05/02 Javascript
vue+element-ui表格封装tag标签使用插槽
2020/06/18 Javascript
Python中SOAP项目的介绍及其在web开发中的应用
2015/04/14 Python
python验证码识别教程之利用投影法、连通域法分割图片
2018/06/04 Python
python实现猜单词小游戏
2020/05/22 Python
Python matplotlib通过plt.scatter画空心圆标记出特定的点方法
2018/12/13 Python
Python合并同一个文件夹下所有PDF文件的方法
2019/03/11 Python
python  logging日志打印过程解析
2019/10/22 Python
台湾菁英交友:结识黄金单身的台湾人
2018/01/22 全球购物
C语言怎样定义和声明全局变量和函数最好
2013/11/26 面试题
2014信息公开实施方案
2014/02/22 职场文书
优秀本科毕业生自荐信
2014/07/04 职场文书
2015年城市管理工作总结
2015/05/23 职场文书
nginx网站服务如何配置防盗链(推荐)
2021/03/31 Servers
科学家测试在太空中培育人造肉,用于未来太空旅行
2022/04/29 数码科技