写在最前面随着公司业务的发展，独立的系统也慢慢多了起来，脚手架的必要性也日趋明显。基于此，便开始搭起了脚手架，主要解决两个问题：1.项目的反复配置2.公共组件的自动更新代码地址点这里，可以照着代码再去看这篇文章会觉得更有思路一点使用1.全局按装npm install zn-cli -g2.创建实例zn-cli init [templateType] [projectName]ps：templateType: 模板类型（暂时支持Vue和react的标准模板，后期会陆续支持后台版本，类似于antdPro）projectName: 你需要创建的项目实例名称3.更新脚手架中的公共文件在你的项目实例中执行：npm run update安全性：首先，这个操作是不会覆盖你的业务代码，只会去更新根目录下public文件夹里的文件可选性：每个版本更新的公共文件都会在脚手架的文档中说明，你可以选择你需要的功能对应的版本（后续再讲）代码1.分支master：脚手架代码，全局安装的就是这个玩意，用来拉去对应模板生成react/vue实例的，通过npm安装使用template分支：分支名template开头的都是模板分支。我这里就不一一列举了，因为分支会陆续的添加，脚手架里都会说明test分支：测试分支，用来测试一些功能或者模板用的（可忽略）2.脚手架实现核心代码是在bin目录里，index.js为入口，点开index，可以看到，主要是对node版本做了判断，然后底部引入了cli.js,在看这些代码之前，首先得闲确定你是对以下几个node包是了解的：commander：处理用户命令行输入download：clone git远程仓库代码其他有一些包是辅助类的，比如chalk，ora等，不了解也没关系。先看代码：大致流程：1.获取用户输入2.根据用户输入判断是需要什么模板，下载对应模板到用户输入的项目目录中3.模板下载完成后，调用_cli下面的_reWritePackageJson方法，去更改实例中package.json中的一些配置4.log里面的东西是一些提示性信息基本脚手架就是这个流程，根据用户输入去拉去对应的模板代码到指定的目录。可能你注意到在模板下载完成时我执行了一个进程：spawn(‘rm’, [’-rf’, ${name}/build.js]);删除创建的项目中的build.js文件，为什么，因为这个js是用来更新模板，就像上面我说到的执行npm run update的时候就是通过这个js去做处理的。显然，他应该只存在于脚手架的模板中，而不应该出现在用户的项目实例中。对于用户而言，它是无用的。总结以上就是一个简单脚手架的实现方式，后期也会一直去更新和维护这个脚手架，公司现在新的项目就是基于这个脚手架去搭建的，因为公司现在的项目都是react写的，所以Vue的功能暂时不支持，后期也会慢慢支持vue…