Tomoko component generator

通用的 Tomoko component 模板脚手架

Installation

# 切换源, 推荐使用 nrm 
npm install -g nrm -d

# 添加源
nrm add zbj http://npm.zbjwork.com/

# 切换公司内部源
nrm use zbj

# 安装 yeoman
npm install -g yo -d

# 安装 generator
npm install -g yo generator-tomoko -d

注：若安装过程中报错, 请尝试更新 npm 到最新版本

# 更新 npm
npm install -g npm

Run

初始化脚手架 (NEW)

# 从 gitlab 获取最新模板至全局
$ yo tomoko  init

初始化环境变量 (NEW)

# 初始化本地 gitlabToken 等信息
$ yo tomoko env

初始化组件

# 生成组件目录结构
$ yo tomoko [cmp]

添加 example

进入生成的组件文件夹中, 执行新建 example

$ cd yourComponentName

$ yo tomoko add

What do you get?

Project Structure

.
├── api/
│   └── api.yml
├── doc/
│   └── index.md
├── example/
│   └── index/
│       ├── index.js
│       ├── index.css
│       └── index.tpl
├── src/
│   └── index.js
├── test/
│   ├── e2e/
│       └── test.js   
│   └── unit/
│       └── test.js   
├── .gitignore
├── .gitlab-ci.yml
├── component.json
└── README.md

• /api - 组件外部资源 API 配置目录
• /doc - 组件文档目录
• /example - 组件演示示例
• /src - 组件源文件
• /test - 包含 单元测试, [UI 测试]
• /component.json - 组件基本信息

Other

• https://github.com/yeoman/yo

CHANGELOG

CHANGELOG.md

Work Flow

1. 根据需要传入不同参数 init / cmp / add /env (auto:cmp)

2. 检测本地环境变量是否正确, 如果缺失则提示用户输入

3. 当用户输入至项目名称时, 自动校验当前组件库是否有同名组件