【万字长文】使用最新的webpack5新特性从零一步一步搭建完整的react18+ts构建环境，完善的模块热替换和构建速度和构建结果的优化。

本篇文章我会教大家如何从零开始搭建一个属于自己的 React UI 组件库，该方案使用storybook作为UI文档工具，并使用rollup进行打包，支持less及Typescript。

如果你有项目搭建的需求，工具链开发的需求，那么 Babel 目前仍是一个前端工程师高频使用的产品，在各浏览器厂商纷纷拥抱W3C标准的时候还是会遇到需要将 ES2015+ 的语法进行降级，使得可以在低

大一刚接触组件库时，往往都是直接copy了官网的示例应用到自己的项目中，有时出现了一些与自己想法不符的代码行为，我就会陷入一种很困顿的情境。

日常工作中，几乎每个项目都是由多个人进行维护，每个人的代码书写习惯和风格又不尽相同，在这种情况下，规范和约束就显得尤为重要！

万丈高楼平地起 先找块地，挖个坑 进入项目根目录，执行npm init -y生成初始的package.json文件，并将其配置项的入口main删除，添加private:true

这篇文章将来介绍如何使用React+Typescript开发一个组件并发布到npm仓库。在此实践流程中，踩了许多坑才成功将其发布，因而记录下整个流程，希望能帮助到想发布包到npm的各位小伙伴。

上篇文章中介绍了如何从 0 到 1 搭建一个 React 组件库架子，但为了一两个组件去搭建组件库未免显得大材小用。 这次以移动端常见的一个组件 Popup 为例，以最方便快捷的形式发布一个流程完整的 npm 包。 如果对你有所帮助，欢迎点赞 Star 以及 PR。 如果有所错…