自研脚手架(用于从github上拉取模板到本地的工具 )

2020-08-07  本文已影响0人  廊桥梦醉

在开始写wlj-cli@1.0.0 版本的时候,希望自己写出来个很完美的脚手架,可是写着写着感觉困难蛮多,时间、技术、知识的限制,有了不想写的念头。幸运的是当时正在读一本书中刚好提到一句话完成好过完美,在80%的时间里表现出80分的状态就很好,这句话启发我以一种追求不完美的方式完成了1.0.0版本,然后又慢慢的迭代优化了2.1.0版本,并计划后续出3.0.0版本。

一、功能说明:
        1)5个命令
               wlj 现有命令说明
                wlj add 添加模板
                wlj del 删除模板
                wlj list 现有模板列表
                wlj init 可选择是否为模板配置路由、UI框架、css预处理语言、vuex的进行选择,同时支持 wlj init <模板名称><项目名称>这种格式的命令来下载已经添加到 模板 list 中的模板

        2)添加的模板需要上传到git才可添加

二、使用方式
       a) 安装:npm i wlj-cli -g
       b)现有命令 
                Commands:
                       add       Add a new template
                        del        Delete a template
                        list       List all the templates
                        init       Init a based project

                   Options:
                         -h, --help     output usage information
                         -V, --version  output the version number

       c) 卸载:npm uninstall wlj-cli -g
       d) 若安装过之前旧版本,在安装新版时需要先通过 npm uninstall wlj-cli -g 卸载旧版本

三、后续
    1)增加已有模板list方便使用模板
     2)完善2.0.0版本功能,提升用户体验

     敬请期待。。。

四、cli编写

1. 使用的node api
    commander:负责读取命令,定义当前版本、使用方法、编写四个指令(wlj init等)
    inquirer:负责询问,是否需要路由、vuex、UI框架等
    download-git-repo:下载git库,使用说明请百度
    child_process:主要使用它的exec属性来执行命令
    fs:处理文件的内容读取、更改等
    ejs:处理某些文件的变量变更

2. 步骤
第一步。解析命令
在bin/wlj中引入commander,并且声明 add、del、list、init命令,commander会在同级目录中寻找wlj-add、wlj-del、wlj-list、wlj-init文件。

第二步,询问

以wlj-add命令举例
有了第一步的解析后,我们可以在wlj-add文件中写add命令相关的内容,这里我们再抽象add文件到command目录下,以便更好的分离职责,bin文件只负责解析命令就好了
下面我们看一下command目录下的add文件,如何实现询问

inquirer提供prompt函数来实现询问,其参数为数组,问询顺序将按照数组的顺序来进行

第三步,下载仓库
核心代码如下:

这里需要注意的是url是git的用户名名称/项目名称

第四步,进行npm install
  这一步的核心是使用nodejs提供的child_process中的exec方法执行方法来实现,exec帮助我们在命令行中执行shell命令,exec有对应的回调方法让我们来判断命令执行是否成功,核心代码如下:

是不是很简单呢,看起来简单的东西还是多动手写写比较好

第五步,调试、发布
npm link // 本地调试
npm publish // 发布
通过npm link命令,即可以在命令行工具测试你的cli了,注意在package.json的bin字段中定义好了入口命令文件

具体怎么发布npm包,以及npm包的删除、迭代、废弃可以查看我的另一篇关于npm包的文章:npm包的发布、下载、删除、迭代

文章具体的代码可以查看我的git:wlj-cli

上一篇下一篇

猜你喜欢

热点阅读