@packy-tang/sao-esm
v1.1.0
Published
集成rollup、vue用于快速构建生成esm格式的npm包模板
Downloads
3
Readme
sao-esm
集成rollup、vue用于快速构建生成esm格式的npm包模板
特性
本包特性包括以下内容:
- 构建
- [x] 包产出支持,支持umd/cjs/esm格式内容的产出^1
- [x] 包含babel兼容
- [x] 支持Vue组件构建及本地调试
- [ ] 支持WMF特性[^4]
- 自动化^2
- [x] 支持自动版本管理
- [x] 支持自动产出日志
- [x] 支持一键发布npm
- 测试
- [x] 支持Mocha单元测试,~~支持es2015写法~~ [^3]
- [x] 测试覆盖报告支持
- [ ] 增加关于Vue的e2e测试及可视化支持
- 基础设置
- [x] 通用编辑器设置支持,默认缩减为2空格
使用
直接使用
# 直接安装
$ npx sao npm:@packy-tang/sao-esm my-module
正常使用
本模板基于 SAO 工具制作,需要先安装sao。
$ yarn global add sao
# or
$ npm i -g sao
# 使用
$ sao npm:@packy-tang/sao-esm my-module
研发调试
# sao-esm项目地址:/home/lpre/sao-esm
$ sao /home/lpre/sao-esm my-module
清除sao模板缓存
$ rm -rf ~/.sao/
初次发版
初次发版需要在本地操作,下面是具体步骤:
# 切换并创建`production`分支
$ git checkout -b production
# 自动执行版本更新、产出日志、提交并打上标签等工作
# -- 1.0.0 这步是指定版本号
$ npm run release -- 1.0.0
再次发版
下面是发布命令:
# 请自行切换至`production`分支,并同步`master`分支至`production`分支。
# 在`production`分支下进行
$ npm run release
命令
{
"scripts": {
"serve": "vue-cli-service serve",
"build": "rollup -c",
"watch": "rollup -c -w",
"pretest": "rollup -c -m inline",
"test": "mocha './tests/unit/*.spec.js'",
"test:coverage": "nyc mocha './tests/unit/*.spec.js'",
"rerelease": "npm run build",
"release": "release-it",
"nvm": "sh bin/nvm.sh"
},
}
- 可用的
serve
本地运行build
构建包代码watch
监听代码变化,并持续构建新的包代码test
根据当前包代码进行测试test:coverage
测试并产出测试覆盖率release
执行版本更新、产出日志、提交并打上标签等工作,更多内容请看详细说明nvm
使用nvm切换与当前项目一致的node版本
- 预设
pretest
测试前置命令rerelease
自动发布的前置命令
release命令使用说明
# 指定升级版本
$ npm run release 1.0.1
# 自动完成
$ npm run release -- --ci
TODOList
- [ ]
.jsconfig
VSCode配置支持 - [ ] VSCode编辑器内部断点支持
- [ ] 代码格式化设置(prettier)
- [ ] ESLint代码检测设置
- [ ] 创建时增设node版本限制可选项
仓库制作说明
本仓库是基于lpreterite/sao-esmodule-mold创建,并添加了release-it自动日志产出工具,及drone的配置(CI/CD)。
拆分说明与建议
见 拆分说明与建议 。
License
MIT © packy-tang <[email protected]>
[^3]: 基于Vue指南将用于npm平台下包的代码使用rollup
构建。
[^4]: WMF全称Webpack Module Federation,是webpack5 推出名叫模块联合的新功能,用于解决前端巨石项目的困境。具体看这三份文章:《Webpack 5 之 模块联合(Module Federation)》、《模块共享那些事》、《探索 webpack5 新特性 Module federation 在腾讯文档的应用》。