Evergreen React UI 组件库安装与配置指南：三步跑通本地开发环境
【免费下载链接】evergreen🌲 Evergreen React UI Framework by Segment项目地址: https://gitcode.com/gh_mirrors/evergreen1/evergreen
如果你准备把 Evergreen 这套由 Segment 出品的 React UI 组件库装进自己的项目，这篇安装与配置指南带你走最短路径：拉源码、装依赖、起服务。全程只有三步，跑通了再往下深入。
它能帮你快速做什么
一句话：Evergreen 是一套拿来就能用的 React UI 组件库，Button、Dialog、Menu 这类常用组件自带智能默认值，需要时又给你完全的控制权，特别适合快速搭建企业级后台与管理台。
技术上你只需要记住两件事：它构建在React之上（React 16.8 ~ 18 都能跑）；样式走CSS-in-JS方案，底层布局基于 ui-box，所以组件之间随便组合都很顺手。
✅ 动手前，花 1 分钟过一遍这份安装环境检查清单
- □Node.js：建议装最新稳定版；仓库要求
>=14，低于这个版本启动时大概率会报错 - □包管理器：npm 或 Yarn 二选一即可。仓库里带着
yarn.lock，我们推荐直接用 yarn - □命令行工具：能顺畅执行
git、yarn这类命令就行 - □浏览器：最后验证运行结果要用
清单全勾上了，就可以动手了。
🚀 三步把项目跑起来
第一步：先把源码拿到手
git clone https://gitcode.com/gh_mirrors/evergreen1/evergreen cd evergreen进到目录里能看到package.json、src、docs，就说明源码拉对了。
第二步：安装项目依赖
yarn install耐心等它跑完：没有红色报错、根目录多出node_modules，依赖就装好了。习惯用 npm 的同学把它换成npm install也行，不过 yarn 与仓库锁文件最匹配，少一些意外。
第三步：启动开发服务器并验证运行
yarn dev这条命令会拉起 Storybook 开发服务器，浏览器打开http://localhost:6006，看到一屏屏可交互的组件示例，本地就算真正跑通了。
跑通之后往哪走
先验证一下：在 6006 端口随便点开几个组件（比如 Button、Dialog），能点能交互、样式正常，说明环境和配置都到位了。
两个常见小坑 💡：
- Node 版本过低：跑
yarn dev报引擎相关错误，多半是 Node 低于 14，升级后重试即可 - docs 是独立子项目：
docs/下的文档站点有自己的package.json，想看完整文档站需要在该目录单独执行yarn install && yarn dev，别和根目录的命令混在一起
接下来可以：
- 📖 逛一逛仓库内置文档：docs/ 目录，各组件用法都在 docs/documentation/components/
- 试试自定义主题：Evergreen 自带完整的主题层，参考 docs/documentation/introduction/theming.mdx
- 需要服务端渲染的话，直接看 examples/ssr-next/ 里的 Next.js 示例
- 发布场景再执行
yarn build，会一次性产出 commonjs / esm / umd 三种产物
【免费下载链接】evergreen🌲 Evergreen React UI Framework by Segment项目地址: https://gitcode.com/gh_mirrors/evergreen1/evergreen
创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
