weilai-cli|项目复盘

612 阅读5分钟

楔子

该项目是我在学习脚手架的过程中的产出,在后序学习完毕并补充了 git发布构建 方面的能力后,会逐渐去提供一些可配置的能力。

目前的话,该脚手架只提供了最基础的下载模板的能力。

安装:

npm install -g @weilai-cli/core

使用:

projectName 是项目名称。
脚手架不会创建新的目录,而是会再当前目录下生成模板。
模板的 package 的 name 属性即为 projectName。

weilai-cli init [projectName]

github 地址:weilai-cli

一、项目简介

weilai-cli 目前能够提供的功能有:

  1. 脚手架的通用功能(版本查询、命令帮助、debug)
  2. 通用的项目/组件创建能力(支持定制和快速接入)
  3. 命令动态化,可以手动指定运行的命令模块,可以灵活适应不同不同场景下的需求
  4. 缓存模块和更新

weilai-cli 未来的计划(容我画个饼):

  1. 通用项目/组件的发布能力
  2. 发布过程中自动完成标准的 git 操作
  3. 发布后自动完成云构建等
  4. 发布支持测试/正式两种模式
  5. 提供 open api 开放相关的设置和配置能力

二、项目背景

开发脚手架的核心目标是提升前端研发效能。

减少一些重复性机械性的任务,把这些任务都交给程序自动完成,让开发人员的时间和精力能集中在更需要的地方。

标准化项目的创建、git flow 规范、发布流程、回滚流程

研发过程系统化、数据化,使得研发过程可以量化

痛点分析:

  1. 创建项目/组件时,存在大量重复代码的拷贝 - 快速的复用已有的沉淀
  2. 协同开发,由于 git 操作的不规范,导致分支混乱且操作耗时 - 定制标准的 git 操作规范并集成到脚手架
  3. 发布上线费力耗时而且容易出现各种各样的错误 - 定制标准的上线流程和规范并集成到脚手架

三、实践过程

脚手架的原理和如何实现一个最简单的脚手架的话可以看看我之前的这个文章脚手架闲聊

技术选型

脚手架自然选择我们前端开发人员最熟悉的 Node.js 去进行开发了。

基于性能上的考虑,如果我们把所有功能都集成在 cli 当中的话,那么 cli 的体积就会很大,下载就会很慢很慢,这样体验的话就会很差,所以要对脚手架的功能进行分包处理,按需加载。那么这样的话我们是否又要去维护多个仓库,以及开发时候 cli 和 模块之间的 link 关系有会非常复杂,稍有不慎就会出现各种奇奇怪怪的报错,并且模块升级照成的连锁反应也很麻烦,这方面采取 Lerna 来进行多 Package 的管理,以及处理依赖和 link 的关系和代码的提交软件包的发布等。

创建交互式命令行采用 commander 因为相对于 yargs 来说 commander 更简单和轻量

脚手架架构设计图

weilai-cli 脚手架架构设计图.png

脚手架执行流程图

脚手架执行流程架构图 (1).png

四、解决问题

实践过程中遇到的问题

脚手架实现原理

为什么全局安装 脚手架 后就能注册相应的命令呢?
安装脚手架的时候发生了什么?
为什么可以通过一个注册的命令去执行脚手架?
执行命令的时候发生了什么?
命令指向什么?

在开发脚手架之前,先要了解和掌握脚手架的实现原理,不然连如何实现的都不知道,又何从开发。

通过 npm 全局安装一个脚手架例如 weilai-cli 后,会去解析 package.json 文件中的 bin 配置;
然后会去在 node 的安装目录下的 bin 目录中,创建一个软连接并且连接到下载的软件包中,软连接的名称就是 bin 配置的 key(键值对的键),链接到的文件就是 bin 配置的 value(键值对的值),value 指向的文件中,需要设置 #! /usr/bin/env node 来标识文件执行的方法。

仓库管理

在设计中脚手架会分为很多个模块,那么如何对这些模块进行管理,以及模块之间的关系和版本处理都是一个相当麻烦的事儿。

Lerna 是一个优化基于 git + npm 的多 package 项目的管理工具,能大幅减少重复的操作,提升操作的标准化流程。

Lerna 是架构优化的产物,它揭示了一个架构真理,项目复杂度提升后,就需要对项目进行架构的优化,而架构优化的主要目标往往都是以能效为核心的。

灵活性

如果在项目中使用指定的命令包的话,那么在应付不同场景的情况下就束手无策了,总不能去手动修改脚手架中命令包的指向或者重新整一个出来吧?

在执行命令的时候,通过配置 --targetPath=src 然后设置为全局变量后,在执行命令的模块中去做一些判断和初始化,然后根据结果去下载相应或者使用相应的软件包

五、总结思考

在学习和开发脚手架的过程中学习到了很多东西。

Node.js 的使用和了解都加深了不少,以及知道了很多小而美的库。

这块的内容着实复杂,目前我也就是半懂不懂的样子,还需要对知识点进行总结和梳理。

代码这块还比较杂乱,能优化的部分还挺多,功能上也还不完善。

底子太薄还需要加强基础方面的学习。

本文正在参与「掘金 2021 春招闯关活动」, 点击查看 活动详情