在经历了6、7个项目同时启动，频繁的release测试后，不得不学习一些偷懒的小技巧来提高效率，所以本文将谈最重要的是如何优化发布流程。由于工作，经过build，然后使用FileZilla上传服务器完成部署。前端打包后，在构建仓库执行gitpush，后端自动部署。后端的自动部署确实简化了很多操作，但是对于前端来说，每次发布都需要去构建仓库进行推送操作，尤其是发布频繁的时候，难免会降低效率。这种重复的操作，还是通过脚本来完成的。合适的。所以接下来的重点是如何只执行npmrunbuild就可以完成项目发布。（本文所讲的是基于windows系统和node环境，各个系统的脚本语言可能存在错误，基本思路是一样的。）本文分为两部分。第一部分主要讲前端包发布的优化过程。第二部分简单介绍了后端自动部署的原理。1：前端发布优化首先要明确的是，大部分前端项目的构建过程都是基于node环境的，所以优化过程的主要思路是使用node进行交互与操作系统配合，调用系统脚本完成文件拷贝和git操作。这里我们需要了解执行npmrunbuild时会发生什么。npmrunbuild只是一个语法糖。在package.json中可以看到build/build.js文件实际上是用node执行的。下面我们重写build文件，为了方便对比，我把重写前后的build文件贴在这里，重写前：重写后：我们不需要完全理解build.js中做了什么，我们只需要知道构建成功后在哪里执行我们的脚本没问题。可以清楚的看到webpack打包后的回调函数。找到位置后，我们需要引入children_process。关于这个模块有两点：1、children_process模块??提供了派生子进程的功能。熟悉shell操作的小朋友可以使用这个模块做一些有趣的事情。我们这里主要使用children_process.exec(commad,options,callback)。主要功能是创建一个shell，然后在shell中执行命令。执行完成后，将stdout和stderr作为参数传递给回调方法。想深入了解的童鞋可以去node文档看看2.是关于process.argv的，它提供了获取命令行参数的方法。这个参数就是执行node命令时跟的参数，比如执行nodebuild.jsabc，那么process.argv[1]就是build.js，process.argv[2]就是a，等等。知道了这两点之后，我们就可以设计我们的自定义命令了，因为优化的目的是为了简化操作，所以我们在构建的时候连接了我们自定义的参数，这和后面我们的脚本编写有关，我设计的命令是npmrunbuild(push）（提交）（分支）。这里把括号括起来，方便表达这是一个自定义变量。事实上，没有括号。三个参数的含义如下：1.push表示是否打包直接push到远端；2.commit表示推送到远程执行gitcommit-m'(commitinformation)'，这里提交的信息；3、branch表示gitpushorigin（branch）的分支，表示Publish到正式服务器或者测试服务器自定义参数后，我们在回调中使用exec()执行我们的脚本。这个时候，我们写我们的脚本。我们创建一个新的autopush.bat文件并将其放在我们的根目录中。是的，脚本内容很简单，大概就是执行复制粘贴删除和git操作，脚本如下cdD:\build\test/*进入构建仓库*/gitcheckout%2/*切换构建仓库的分支*/rd/s/qD:\build\test\static/*删除构建仓库的静态文件夹*/xcopyD:\source\test\distD:\build\test/E/I/Y/*从源代码仓库打包然后复制dist文件夹，覆盖build仓库里的文件*/gitadd.gitcommit-m%1/*提交代码*/gitpushorigin%2/*推送到远程，后台自动部署*/cdD:\myFolder\31abc_admin这里有三点：1.先删除构建仓库的static，然后复制覆盖，因为名字每次打包后的js文件在修改后都会发生变化，如果不删除，同名文件不会被覆盖，所以会导致js文件堆积；2.window脚本参数是通过%1获取的，比如%1是获取第一个参数，%2是获取第二个参数，这样我们就可以在build.js中获取执行commit和branch的参数在脚本中传入。3、关于delete和copy中的参数含义，rd/s/q/S表示删除该目录下所有遍历的子目录和文件/Q删除目录时不提示确认，直接删除/E/I/Y后面的xcopy/E复制所有子目录，包括空目录。/I如果“Source”是目录或包含通配符且“Destination”不存在，则“xcopy”假定“destination”指定目录名称并创建一个新目录。然后“xcopy”会将所有指定的文件复制到新目录中。默认情况下，“xcopy”将提示您指定“目标”是文件还是目录/y禁止提示确认覆盖现有目标文件。通过以上操作，我们通过一行命令npmrunbuildpushfixmaster就可以完成打包推送操作。这时候如果后台设置了自动部署，那么就直接上线了。二：后端自动部署网上已经有很多关于自动部署的文章。为了配合本文，这里简单介绍一下自动部署的原理。自动部署的关键在于webhook，主流代码托管平台都有这个功能，包括coding、github等，都可以在仓库中设置。以github为例。在这个位置可以填写一个自己服务器的接口地址和一个验证用的seret。填写完成后，仓库会监听推送操作。一旦有Push操作，webhook会向你设置的接口发送post请求，然后在服务器端执行脚本进行gitpull操作，拉取最新的代码，完成部署。
