React 库的开发规范:利用 Rollup 与 Dts-bundle 生成高性能、多格式支持的 React 组件库

灵魂拷问:你的 React 组件库是给谁用的?是给人类看的,还是给机器看的? 大家好,欢迎来到今天的“搬砖进阶班”。我是你们的老朋友,一个在代码堆里摸爬滚打多年,看着各种构建工具从 Webpack 1.0 到 Vite,头发越来越稀疏,技术却越来越硬核的资深工程师。 今天我们不聊业务逻辑,不聊怎么把那个难搞的需求搞定。今天我们要聊的是——如何优雅地把你写的那堆 React 组件,打包成一个让全世界开发者都爱不释手的“超级英雄”库。 想象一下,你辛辛苦苦写了三个组件:SuperButton、SuperInput 和 SuperModal。你把它们放在 src/components 里面,然后直接扔给用户:“拿去用吧,import { SuperButton } from ‘./SuperButton’。” 用户会怎么做?他会一脸懵逼地打开终端,然后报错:“找不到模块 ‘./SuperButton’”。为什么?因为浏览器不认识 TypeScript,不认识 JSX,更不认识你那一堆散落在文件夹里的 .tsx 文件。浏览器只认识一种语言:JavaScript(或者它的 …