开发自己的脚手架
因为我们使用脚手架创建项目的时候,很多配置都是没有的,比如路由的匹配,redux,这些,所以我们可以开发自己的脚手架。
第一步
我们希望可以在命令行敲下某个命令时,执行代码,如
只需要
新建两个文件,
这个注释是关键,固定用法,然后
在package.json文件加一个属性bin指定输入aaa的时候用node执行index.js,这时候在npm link后,就可以i输入aaa执行index.js文件了,效果跟node index.js一样。
那我们想跟命令呢
比如 aaa -v, aaa create xxx等等,
我们可以借助一个库,commander.js。vue的脚手架也是借助于这个库。
借助这个库就能将我们输入在命令行的指令解析并且执行
可以增在自定义的options,也可以监听help事件。当然我们希望这些配置放在一份单独的文件,
现在我们想aaa craete xxx安装我们的项目
要做的事情就是将我们放在register仓库的模板下载下来,然后npm install 然后启动项目
创建一个指令函数
输入指令运行时,就会执行action的函调函数。思路就是输入这个命令时,去仓库里面下载模板放到我们的my-app文件去。
主要是这个actions
actions四部操作,首先是clone项目,借助一个库,download-git-repo
由于这个版本比较老,所以没有Pormise的处理方式,这里有个骚操作,
node内置了util模块,可以让我们解决这个问题,让这个函数能像处理pormise一样被处理。
这样download就可以使用async await
接着第一步 clone模板
这样基本就好了,这里我用了自己写的模板,react里面有适配,redux,route的封装,qiankun包裹一层等等
https://gitee.com/fine509/react_template_ts.git
然后i初步执行aaa create test
就会从gitee上面拉去模板代码
然后执行yarn install 和yarn start就能正常启动了。第一步就大功告成了