首先需要将代码仓库 clone 下来: github.com/wechat-mini… develop 分支。
初次将代码 clone 下来后,需要先运行 npm run prepare
来完成 lerna 的初始化,之后才能进入开发的流程:
npm run test npm run check npm run publish
具体规范下面进行说明:
kbone 是一套同构方案,包含多个包,各个包之间可能会有依赖关系,故采用 lerna 来进行管理。
|-- docs 文档 |-- examples 案例 | |-- demo1 | |-- demo2 | |-- ... | |-- README.md 案例说明 | |-- packages |-- .eslintignore |-- .eslintrc.js |-- .gitignore |-- lerna.json |-- LICENSE |-- package.json |-- README.md 复制代码
eslint 相关配置所有包统一,所以放到包外。
|-- src 源码 |-- test 单元测试 |-- tool 构建相关代码 |-- .npmignore |-- CHANGELOG.md 更新日志 |-- package.json |-- README.md 复制代码
对于部分包需要构建,则构建相关的配置、脚本需要放到 tool 目录下;如果包还有特殊需求,亦可以在不修改现有目录结构的前提下在根目录补充其他文件和目录(如补充 eslint 配置等)。
|-- build | |-- miniprogram.config.js kbone 插件配置 | |-- webpack.config.js Web 端构建配置 | |-- webpack.mp.config.js 小程序端构建配置 | |-- src 源码 |-- index.html Web 端入口 html 文件 |-- package.json 复制代码
如果此 demo 不需要 Web 端的展示,可以去掉 Web 端代码;一般情况下尽量遵从此结构来编写案例,但是也允许针对特殊情况调整结构(如 vue-cli3 插件案例)。
统一走 eslint 来约束,在 kbone 根目录下执行: npm run lint
会对各个包内的 src、test、tool 目录下的 js 文件进行检查,确保无任何规则失败提示。
各个包内部实现单元测试和覆盖率检查,统一使用 jest 工具链;如果涉及到自定义组件则使用 miniprogram-simulate;如果有 CI 需求,则使用 codecov 来管理覆盖率检查。
包内命令统一为:
# 执行单元测试 npm run test # 调试单元测试 npm run test-debug # 执行覆盖率检查 npm run coverage # 接入 CI 覆盖率检查 npm run codecov 复制代码
PS:可参考 packages/miniprogram-element 的实现。
在包内实现完单元测试后,需要在 kbone 根目录下的 package.json 中补充相应的执行命令,确保在 kbone 根目录下执行 npm run test
可以执行所有包内的单元测试。
格式为 [变化]: 具体操作
,一条完整的示例: feature: support camera inner component
。
变化支持如下枚举值:
我来评几句
登录后评论已发表评论数()