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 相关文章推荐
用javascript获取当页面上鼠标光标位置和触发事件的对象的代码
Dec 09 Javascript
javascript实现数字验证码的简单实例
Feb 10 Javascript
jquery得到iframe src属性值的方法
Sep 25 Javascript
js实现的简单radio背景颜色选择器代码
Aug 18 Javascript
JS+CSS实现简易实用的滑动门菜单效果
Sep 18 Javascript
javascript 缓冲运动框架的实现
Sep 29 Javascript
spirngmvc js传递复杂json参数到controller的实例
Mar 29 Javascript
jQuery轮播图实例详解
Aug 15 jQuery
jQuery轻量级表单模型验证插件
Oct 15 jQuery
微信小程序MUI侧滑导航菜单示例(Popup弹出式,左侧滑动,右侧不动)
Jan 23 Javascript
Vue使用screenfull实现全屏效果
Sep 17 Javascript
如何理解Vue简单状态管理之store模式
May 15 Vue.js
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
5.PHP的其他功能
2006/10/09 PHP
我的论坛源代码(十)
2006/10/09 PHP
PHP获取MAC地址的函数代码
2011/09/11 PHP
php.ini-dist 和 php.ini-recommended 的区别介绍(方便开发与安全的朋友)
2012/07/01 PHP
phpnow php探针环境检测代码
2014/11/04 PHP
smarty模板引擎中自定义函数的方法
2015/01/22 PHP
父窗口获取弹出子窗口文本框的值
2006/06/27 Javascript
JavaScript设计模式之外观模式实例
2014/10/10 Javascript
js实现图片放大和拖拽特效代码分享
2015/09/05 Javascript
jQuery页面弹出框实现文件上传
2017/02/09 Javascript
jQuery模拟淘宝购物车功能
2017/02/27 Javascript
详解Vue 方法与事件处理器
2017/06/20 Javascript
JavaScript实现鼠标滚轮控制页面图片切换功能示例
2017/10/14 Javascript
webpack构建的详细流程探底
2018/01/08 Javascript
详解Ubuntu安装angular-cli遇到的坑
2018/09/08 Javascript
详解关于React-Router4.0跳转不置顶解决方案
2019/05/10 Javascript
mock.js模拟数据实现前后端分离
2019/07/24 Javascript
js 实现ajax发送步骤过程详解
2019/07/25 Javascript
JS co 函数库的含义和用法实例总结
2020/04/08 Javascript
Js和VUE实现跑马灯效果
2020/05/25 Javascript
Python简单实现TCP包发送十六进制数据的方法
2016/04/16 Python
Python中如何获取类属性的列表
2016/12/26 Python
用Python分析3天破10亿的《我不是药神》到底神在哪?
2018/07/12 Python
实例讲解Python中浮点型的基本内容
2019/02/11 Python
关于python多重赋值的小问题
2019/04/17 Python
使用phonegap创建联系人的实现方法
2017/03/30 HTML / CSS
Ray-Ban雷朋太阳眼镜英国官网:Ray-Ban UK
2019/11/23 全球购物
捷克建筑材料网上商店:DEK.cz
2021/03/06 全球购物
怎样声明接口
2014/09/19 面试题
个人职业生涯规划书1500字
2013/12/31 职场文书
大学生社团活动总结
2014/04/26 职场文书
司法助理专业自荐书
2014/06/13 职场文书
教师个人教学反思
2016/02/23 职场文书
python中Matplotlib绘制直线的实例代码
2021/07/04 Python
Python 多线程处理任务实例
2021/11/07 Python
Go语言测试库testify使用学习
2022/07/23 Golang