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 相关文章推荐
newxtree.js代码
Mar 13 Javascript
JavaScript效率调优经验
Jun 04 Javascript
分享一个自定义的console类 让你不再纠结JS中的调试代码的兼容
Apr 20 Javascript
获取元素距离浏览器周边的位置的方法getBoundingClientRect
Apr 17 Javascript
JS组件Bootstrap Table表格多行拖拽效果实现代码
Dec 08 Javascript
ionic+AngularJs实现获取验证码倒计时按钮
Apr 22 Javascript
vue项目部署到Apache服务器中遇到的问题解决
Aug 24 Javascript
使用weixin-java-tools完成微信授权登录、微信支付的示例
Sep 26 Javascript
Koa代理Http请求的示例代码
Oct 10 Javascript
JS实现可视化音频效果的实例代码
Jan 16 Javascript
JS 数组基本用法入门示例解析
Jan 16 Javascript
vue中移动端调取本地的复制的文本方式
Jul 18 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 parse_url 一个好用的函数
2009/10/03 PHP
让Nginx支持ThinkPHP的URL重写和PATHINFO的方法分享
2011/08/08 PHP
PHP水印类,支持添加图片、文字、填充颜色区域的实现
2017/02/04 PHP
Laravel5框架自定义错误页面配置操作示例
2019/04/17 PHP
浅谈laravel框架sql中groupBy之后排序的问题
2019/10/17 PHP
JavaScript 学习笔记(四)
2009/12/31 Javascript
jWiard 基于JQuery的强大的向导控件介绍
2011/10/28 Javascript
JS实现文字向下滚动完整实例
2015/02/06 Javascript
JavaScript获取文本框内选中文本的方法
2015/02/20 Javascript
JavaScript数组去重的五种方法
2015/11/05 Javascript
Angular.js 实现数字转换汉字实例代码
2016/07/14 Javascript
判断js的Array和Object的实现方法
2016/08/29 Javascript
详解用webpack2.0构建vue2.0超详细精简版
2017/04/05 Javascript
Vue核心概念Getter的使用方法
2019/01/18 Javascript
JavaScript中的垃圾回收与内存泄漏示例详解
2019/05/02 Javascript
VUE组件中的 Drawer 抽屉实现代码
2019/08/06 Javascript
使用Vue.set()方法实现响应式修改数组数据步骤
2019/11/09 Javascript
使用Vue生成动态表单
2019/11/26 Javascript
JavaScript观察者模式原理与用法实例详解
2020/03/10 Javascript
微信小程序订阅消息(java后端实现)开发
2020/06/01 Javascript
vue 在methods中调用mounted的实现操作
2020/08/07 Javascript
[33:19]完美世界DOTA2联赛PWL S2 PXG vs InkIce 第一场 11.26
2020/11/30 DOTA
python绘图方法实例入门
2015/05/19 Python
python+Django+apache的配置方法详解
2016/06/01 Python
sublime python3 输入换行不结束的方法
2018/04/19 Python
python print出共轭复数的方法详解
2019/06/25 Python
python3连接kafka模块pykafka生产者简单封装代码
2019/12/23 Python
纪伊国屋新加坡网上书店:Kinokuniya新加坡
2017/12/29 全球购物
大学自主招生自荐信
2013/12/16 职场文书
因家庭原因离职的辞职信范文
2015/05/12 职场文书
健康证明
2015/06/19 职场文书
遗失证明范文
2015/06/19 职场文书
个人的事迹材料怎么写
2019/04/24 职场文书
Java后台生成图片的完整步骤
2021/08/04 Java/Android
Python利用capstone实现反汇编
2022/04/06 Python
默认网关不可用修复后过一会又不好使了解决方法
2022/04/08 数码科技