蜡笔猫导航Stencil
用来构建可复用 Web Component 组件库与设计系统的编译工具链，基于 TypeScript，产出的组件可分发给 React、Angular、Vue 等框架使用。
它能做什么
- 把 TypeScript + JSX 组件编译为符合标准的 Web Component
- 框架无关，单一组件库可供 React、Angular、Vue 或原生页面使用
- 支持静态站点生成，便于搭建组件文档站
- 零配置默认、内置开发服务器与热更新、单元测试与 JSDoc 文档生成
- MIT 开源，由 Ionic 团队维护
适合谁
- 前端团队搭建跨框架复用的组件库
- 为产品建立统一设计系统与组件文档站
- 需要把组件分发给多个框架的应用项目
详细介绍
Stencil 是一个基于 TypeScript 与 Web Component 标准的组件编译工具链，主要面向需要维护跨框架组件库或设计系统的前端团队。它把组件源码编译成符合规范的自定义元素（使用 Shadow DOM、slots 等标准能力），让同一份代码可以同时用在 React、Angular、Vue 以及传统网页项目中。除组件编译外，它还提供静态站点生成、treeshaking 与按需加载等能力，便于搭建组件文档站与渐进式应用；并可从贴近代码的 JSDoc 注释自动生成文档。使用方式是通过命令行（npm init stencil）创建项目、编写组件后编译产出可分发的组件包，具体命令请以官方文档为准。