从零搭建一个 React & npm 组件库

前端狗

2019/09/18 发布于 技术 分类

文字内容
1. 从零搭建一个 React & npm 组件库
2. 为什么需要组件库?
4. npm 生态圈
5. Package.json
6. 发布 npm publish
7. 那组件库发布呢?
8. Babel
9. 可能会遇到的问题 • 组件间的依赖 • 被依赖组件的更新,引起的连锁反映 • 组件粒度化的发布 • 与版本管理工具的联动 • 开发调试
11. What's Lerna
12. Lerna 项目长什么样子
13. 组件库的发布
14. 组件库的发布 lerna publish 根据 git 信息,检查产生修改的组件 更新有过修改的组件的版本号,同时更新引用方组件的版本号 将 package.json 修改提交 git, 并以该版本号作为 commit 信息 将所有有修改的组件发布至 npm 发布完成
15. 如何开发一个像 Ant-Design 这样 React 组件库呢?
17. Storybook
18. Storybook 1. 与 React 一致的开发体验 2. 独立的开发环境 3. 热重载 4. UI 测试环境 5. 文档生成
19. Storybook – 安装 npm i –g getstorybook cd my-react-component getstorybook
20. Storybook – 基础目录 config.js
21. Storybook – 开始构建你的环境
22. Storybook – 开始构建你的环境
23. Lerna + StoryBook ?
24. 组件库目录结构
25. 组件库 - 多入口引用 config.js
26. 组件库 - 构建修改 .storybook/webpack.config.js
27. 组件库 - 构建修改 .storybook/webpack.config.js
28. 组件库 - 修改package.json Package.json 配置
29. 组件库 - 发布
31. 组件库 1. 集中管理 2. 独立的测试环境 3. 一致的开发体验 4. 版本管理 5. 增量发布 6. 文档生成
32. Thx ! 何方舟 Adamhe