gulp加批处理(.bat)实现ng多应用一键自动化构建


Posted in Javascript onFebruary 16, 2017

批处理

常用常见的批处理文件有.bat文件,可用文本编辑器直接编辑内部代码,运行也比较方便,windows平台直接双击执行即可,具体请自行了解。

需求背景

angular项目中,当项目越来越大时,很多通用模块(module)可能需要抽象出来,这是一点,另外可能有某些子应用也会单独抽离出来,这是另一点。

当一个大型项目同时包括多个子应用时,编码后的编译或者打包就会比较麻烦,特别是在项目持续集成的一种状态下,或者项目组有新成员(经验稍微薄弱)情况下。

需要了解

看下面的代码之前,如果您是angular使用者+gulp使用者,为了更好的理解下面的代码,你可能需要了解以下东西:node、npm、node_modules、gulp。

如果您不使用angular或者gulp,也没有太大关系,你可以通过我肤浅的解释来理解一些批处理相关的操作,以应用到其他用途。

示例&&解释

// 关闭回显,加上这句,当前执行的命令不会显示(即,下面这些代码不会显示在屏幕上)
 @echo off

 // 读取run_config.txt文件第一行数据,以参数domain存储,然后跳转到secondArgs命令执行
 // 我这么写不可取,跳转secondArgs命令主要用于读取第二行数据
 for /f %%i in (run_config.txt) do (
 set domain=%%i
 goto secondArgs
 )

 // 读取第二行数据以参数dir存储
 :secondArgs
 for /f %%i in (run_config.txt) do (
 set dir=%%i
 )

 // 输出参数domain、dir
 echo the root path is:%domain%
 echo the project path is:%dir%

 echo AUTO RUNING, PLEASE ENTER ACCORDING THE TIPS......

 // begin命令
 :begin
 echo ************TIPS START************
 echo at the first use,please input 'm' to set root path and project path according the tips.
 echo ************TIPS ENDS!************

 // 改变字体颜色,可选颜色不多
 color 07
 // 以命令选择的形式,给使用者选择的权利,其中将各个项目(各应用)需要的打包分离出来,分别对应相应的自动化构建脚本命令
 // 以字母RCAPMQ一一对应,例如输入Q,则进入exit命令
 choice /m ROOT,COMMONS,APP,PORTAL,MODIFY,EXIT /c:RCAPMQ

 if errorlevel 6 goto exit
 if errorlevel 5 goto modify
 if errorlevel 4 goto portal
 if errorlevel 3 goto app
 if errorlevel 2 goto commons
 if errorlevel 1 goto root

 :root
 color 0a
 // 用于进入对应的盘符
 %domain%
 // 用于进入对应的项目目录
 cd%dir%
 // 执行当前目录下的gulp命令
 node %domain%%dir%\node_modules\gulp\bin\gulp.js
 echo -----------------------------ROOT PROCESS FINISHED!----------------------------
 // 跳转begin命令,可以让使用者进行下一次使用
 goto begin
 // 以下几个命令类似上面

 :commons
 color 0d
 %domain%
 cd%dir%\commons
 node %domain%%dir%\node_modules\gulp\bin\gulp.js
 echo ----------------------------COMMONS PROCESS FINISHED!--------------------------
 goto begin

 :app
 color oe
 %domain%
 cd%dir%\app
 node %domain%%dir%\node_modules\gulp\bin\gulp.js debug
 echo ---------------------------APP_BASE PROCESS FINISHED!--------------------------
 goto begin

 // 该命令可以进行多个应用的一键构建
 :portal
 color 0a
 %domain%
 cd%dir%
 node %domain%%dir%\node_modules\gulp\bin\gulp.js
 cls
 echo -----------------------------ROOT PROCESS FINISHED!----------------------------
 echo ***************************COMMONS PROCESS STARTING!***************************
 color 0d
 %domain%
 cd%dir%\commons
 node %domain%%dir%\node_modules\gulp\bin\gulp.js
 cls
 echo ----------------------------COMMONS PROCESS FINISHED!--------------------------
 echo ******************************APP PROCESS STARTING*****************************
 color 0e
 %domain%
 cd%dir%\app
 node %domain%%dir%\node_modules\gulp\bin\gulp.js debug
 cls
 echo ------------------------------APP PROCESS FINISHED-----------------------------
 echo *******************************************************************************
 color 0f
 goto begin

 // modify命令用于修改盘符及项目目录路径
 :modify
 // 删除config文件
 del run_config.txt
 // '/p'会暂停当前命令
 // 此处主要用于获取用户输入
 set /p domain=please input yours root path,end with ':', eg.'d:':
 echo the root path is:%domain%
 // 输出输入的信息并保存到config文件中
 @echo %domain%>>run_config.txt

 set /p dir=please input yours project path, start with '/', eg. '/xx/xx':
 echo the project path is:%dir%
 @echo %dir%>>run_config.txt
 goto begin

 // 关闭当前窗口
 :exit
 pause

心得

弄这个.bat文件,主要也是为了偷懒。花了一点时间查找了相应的操作、使用说明,也算是初步可用。

目前使用起来也比较方便,可以在以后有机会时再次自定义一个类似文件,便捷开发,提高效率。

好了,以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
this和执行上下文实现代码
Jul 01 Javascript
javascript基础知识大集锦(二) 推荐收藏
Jan 13 Javascript
js使用栈来实现10进制转8进制与取除数及余数
Jun 11 Javascript
JS判断字符串字节数并截取长度的方法
Mar 05 Javascript
jQuery实用小技巧_输入框文字获取和失去焦点的简单实例
Aug 25 Javascript
Jquery UI实现一次拖拽多个选中的元素操作
Dec 01 Javascript
Bootstrap整体框架之JavaScript插件架构
Dec 15 Javascript
jQuery在header中设置请求信息的方法
Mar 06 Javascript
详解vue 配合vue-resource调用接口获取数据
Jun 22 Javascript
js实现会跳动的日历效果(完整实例)
Oct 18 Javascript
js常见遍历操作小结
Jun 06 Javascript
解决layui弹框失效的问题
Sep 09 Javascript
JS实现DIV高度自适应窗口示例
Feb 16 #Javascript
Js apply方法详解
Feb 16 #Javascript
JavaScript实现的XML与JSON互转功能详解
Feb 16 #Javascript
js实现文字无缝向上滚动
Feb 16 #Javascript
node学习记录之搭建web服务器教程
Feb 16 #Javascript
Angular实现跨域(搜索框的下拉列表)
Feb 16 #Javascript
基于Bootstrap 3 JQuery及RegExp的表单验证功能
Feb 16 #Javascript
You might like
最简单的PHP程序--记数器
2006/10/09 PHP
解析php中static,const与define的使用区别
2013/06/18 PHP
php使用mkdir创建多级目录入门例子
2014/05/10 PHP
详解PHP中的null合并运算符
2015/12/30 PHP
Linux安装配置php环境的方法
2016/01/14 PHP
Yii框架连接mongodb数据库的代码
2016/07/27 PHP
js获取php变量的实现代码
2013/08/10 Javascript
js如何判断访问是来自搜索引擎(蜘蛛人)还是直接访问
2015/09/14 Javascript
jquery实现定时自动轮播特效
2015/12/10 Javascript
理解Javascript文件动态加载
2016/01/29 Javascript
手机Web APP如何实现分享多平台功能
2016/08/19 Javascript
jQuery autoComplete插件两种使用方式及动态改变参数值的方法详解
2016/10/24 Javascript
ES6新特性之模块Module用法详解
2017/04/01 Javascript
Vuejs 页面的区域化与组件封装的实现
2017/09/11 Javascript
bootstrap实现二级下拉菜单效果
2017/11/23 Javascript
基于vue-element组件实现音乐播放器功能
2018/05/06 Javascript
vue中使用element ui的弹窗与echarts之间的问题详解
2019/10/25 Javascript
原生js实现商品筛选功能
2019/10/28 Javascript
[46:43]DOTA2上海特级锦标赛D组小组赛#1 EG VS COL第三局
2016/02/28 DOTA
[02:51]DOTA2 Supermajor小组分组对阵抽签仪式
2018/06/01 DOTA
python模拟鼠标拖动操作的方法
2015/03/11 Python
python3批量删除豆瓣分组下的好友的实现代码
2016/06/07 Python
python3大文件解压和基本操作
2017/12/15 Python
Python使用Selenium模块模拟浏览器抓取斗鱼直播间信息示例
2018/07/18 Python
python实现画五角星和螺旋线的示例
2019/01/20 Python
PyCharm专业最新版2019.1安装步骤(含激活码)
2019/10/09 Python
详解Python 循环嵌套
2020/07/09 Python
Python getsizeof()和getsize()区分详解
2020/11/20 Python
HTML5 canvas画矩形时出现边框样式不一致的解决方法
2013/10/14 HTML / CSS
教师师德反思材料
2014/02/15 职场文书
优秀学生评语大全
2014/04/25 职场文书
供应链金融服务方案
2014/05/25 职场文书
商务英语专业毕业生求职信
2014/07/06 职场文书
应聘教师求职信
2014/07/19 职场文书
农业局党的群众路线教育实践活动整改方案
2014/09/20 职场文书
2019年学校消防安全责任书(2篇)
2019/10/09 职场文书