geeeger/ts-react-components-scaffold

拼凑的脚手架，过于冗余

ts-react-components 开发脚手架

使用工具

• webpack@^4.28.0
• typescript@^3.5.0
• storybook/react@^5.0.11
• [email protected]
• gulp@^4.0.0

参考工具 (cv)

• create-react-app
• rc-tools
• antd-tools

相关资料

• webpack4中文文档
• ts3中文文档,建议看官方英文
• storybook/react文档
• storybook/addons相关，直接查看github仓库readme方便,只集成了部分addons,具体请看依赖表
• jest文档
• gulp4文档
• babel7中文文档
• babel-loader文档
• eslint-config-react-app文档
• eslint中文文档
• stylelint文档
• @commitlint/configangular文档
• husky git钩子文档
• lint-staged文档
• preitter文档
• test相关 enzyme文档
• test相关 @testing-library/react
• test相关 react-test-renderer

项目相关

如何修改umd包的信息

可修改scripts/rc-tools/config/webpack.base.js 的output选项

如何修改无需引入的全局依赖

可增减scripts/rc-tools/config/webpack.base.js 的externals子项

如何修改lib包产出

可修改tsconfig.json 可修改为产出带babelruntime的es5 commonjs模块

是否允许修改该模板

允许，因为该模板本身就是拼凑的，有很多地方，工具以及任务是冗余的

如何开发

将保护master分支，开发分支时从master检出，由owner检查代码后合并至master(目前没有ci，没有集成ci功能)

vscode sublime支持

如果使用vsc请升级最新vscode并安装推荐插件，

如果使用sublime请升级最新版本，并在菜单-项目-打开项目中选择components.sublime-project。

sublime功能并不完善，建议使用vsc进行开发。

Usage

安装项目依赖

npm i

---

使用storybook作为开发环境(启动项目、可视的)

npm run storybook

---

同时可再起一个testwath 对测试进行watch

npm run test:watch

---

构建产出

npm run build

---

从模板创建一个组件

npm run create -- -n TestComponent

其他命令

按git commit生成changelog

npm run changelog

---

测试

npm test

---

对全部文件进行格式化(不区分文件类型)

npm run prettier

---

对源文件进行格式化（只格式化js,jsx,ts,tsx,json,md）

npm run prettier:source

---

对源文件进行eslint检查

npm run eslint

---

对源文件进行eslint检查并自动修复可修复项

npm run eslint:fix

---

对源文件样式进行检查

npm run stylelint

---

对源文件样式进行检查并自动修复可修复项

npm run stylelint:fix

---

对源文件进行typecheck

npm run typecheck