概述

接下来我们将从工程角度分析本项目。本项目采用大仓模式，利用 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

介绍这些项目是如何融入到本项目的。