概述
接下来我们将从工程角度分析本项目。本项目采用大仓模式,利用 yarn + lerna 对项目进行管理,项目结构如下:
.
├── packages
│ ├── core 俄罗斯方块的核心逻辑
│ ├── console 俄罗斯方块的控制台版本的实现
│ ├── web 俄罗斯方块的web版本的实现
├── app 基于vue的web版本测试入口
├── docs 文档
其中,core
是俄罗斯方块的核心逻辑,console
是俄罗斯方块的控制台版本的实现,web
是俄罗斯方块的 web 版本的实现。彼此之间通过workspace
进行关联。
基本介绍
为什么采用大仓模式
按照之前的抽象,core
层是抽象出来的核心逻辑,其渲染必须依赖于具体的平台,所以console
和web
层是core
的具体实现。这样的设计,使得core
层可以被多个平台复用,而不用关心具体的渲染逻辑。因此,肯定会存在多个实现依赖于core
层的情况,所以采用大仓模式是最合适的。
对于依赖共享,业界有很多的解决方案,如npm link
、yarn link
、npm install
、yarn install
等。但是这些方案都有各自的问题,如npm link
、yarn link
需要手动链接,npm install
、yarn install
会将依赖安装到node_modules
中,不利于调试。而lerna
则是专门为解决这个问题而生的,它可以将多个包链接到一起,同时可以将依赖安装到根目录的node_modules
中,非常适合大仓模式。
开发语言
使用 TS 作为开发语言,个人认为 TS 具有一下优势:
- 静态类型检查,减少运行时错误
- 代码提示,提高开发效率
- 方便生成文档,提高代码可读性。可以输出
d.ts
文件,方便其他人使用。
编译系统
既然使用了 TS,那就需要对 TS 进行编译。这里使用rollup
进行编译,rollup
是一个模块打包器,它可以将多个模块打包成一个文件。rollup
的优势在于,它可以进行tree-shaking
,即只打包使用到的模块,减少打包体积。
测试
单元测试和集成测试,单元测试使用 jest,集成测试则使用专门的项目进行测试。
packages/console
自带启动脚本,可以通过它快速开启一个控制台版本的俄罗斯方块,方便测试。app
使用vue
进行测试,可以通过yarn dev
启动一个 web 版本的俄罗斯方块,方便测试。
代码规范
使用 eslint 进行代码规范检查
在根目录运行: yarn lint
进行代码检查。
同时为了为了保证质量,引入了husky
,在提交代码时进行检查。
日志格式
对于 git 的 commit log 的检查,使用commitlint
,并配置了husky
,在提交代码时进行检查。
发布
使用lerna
进行发布,可以一次性发布所有的包。
小结
后续章节我们将详细介绍文中介绍的内容,包括但不限于:
- 大仓
- TS
- rollup
- jest
- eslint
- husky
- commitlint
- lerna
介绍这些项目是如何融入到本项目的。