这是什么?
Evergreen 是 Segment 出品的 React UI 框架,包含一套打磨过的、企业级的 React 组件,用在 Web 应用里开箱即用。
Evergreen 是 Segment 出品的 React UI 框架,包含一套打磨过的、企业级的 React 组件,用在 Web 应用里开箱即用。它是用来搭建整个应用的框架,还是一组按需挑选的组件?它是一个组件库:提供多个组件和工具,你可以逐个导入使用,全部构建在 ui-box 这个 React UI 基础组件之上,方便组合。
它是一个组件库:提供多个组件和工具,你可以逐个导入使用,全部构建在 ui-box 这个 React UI 基础组件之上,方便组合。怎么把它加到我的 React 应用里?先安装 evergreen-ui 包(npm install evergreen-ui),然后导入你需要的组件即可——在 Create React App 这类标准 React 项目里都能直接用。
先安装 evergreen-ui 包(npm install evergreen-ui),然后导入你需要的组件即可——在 Create React App 这类标准 React 项目里都能直接用。除了 React 之外还需要装别的东西吗?不需要,只要有 React 和 npm 就行——这个包会自己拉取所需的依赖(比如 downshift 和 lodash 的辅助函数);如果想从源码构建仓库,则需要 Node 14+。
不需要,只要有 React 和 npm 就行——这个包会自己拉取所需的依赖(比如 downshift 和 lodash 的辅助函数);如果想从源码构建仓库,则需要 Node 14+。它会强制我使用它自己的样式体系吗?它采用 CSS-in-JS——Evergreen 内置了来自 ui-box 的方案——所以样式写在你的 JavaScript 里,而不是单独的 CSS 文件。
它采用 CSS-in-JS——Evergreen 内置了来自 ui-box 的方案——所以样式写在你的 JavaScript 里,而不是单独的 CSS 文件。它只适合企业级应用吗?它的设计语言面向企业级 Web 应用,但这些组件是通用的,在任何 React 应用里都能开箱即用。
它的设计语言面向企业级 Web 应用,但这些组件是通用的,在任何 React 应用里都能开箱即用。可以免费在商业项目里使用吗?可以——MIT 协议,商用也免费。有一点要注意:内置的 BlueprintJS 图标采用的是自定义版 Apache 2.0 协议。
可以——MIT 协议,商用也免费。有一点要注意:内置的 BlueprintJS 图标采用的是自定义版 Apache 2.0 协议。能用我自己的主题自定义外观吗?可以——Evergreen 开箱就支持完善的主题定制,官方文档里对主题部分也有详细介绍。
可以——Evergreen 开箱就支持完善的主题定制,官方文档里对主题部分也有详细介绍。支持服务端渲染吗?支持——通过 extractStyles() 函数可以轻松实现 SSR 并自动完成水合(hydration),仓库里还附带 Next.js 和 GatsbyJS 的示例配置。
支持——通过 extractStyles() 函数可以轻松实现 SSR 并自动完成水合(hydration),仓库里还附带 Next.js 和 GatsbyJS 的示例配置。Segment 为什么要自己做一套 UI 组件库?源于他们的几个核心理念:未来的需求永远无法全部预测,所以要打造能应对变化的系统;提供智能默认值,同时保留需要时的完全控制;并让使用和参与贡献这个库都保持愉快的体验——因此他们特别重视文档和开发者体验。
源于他们的几个核心理念:未来的需求永远无法全部预测,所以要打造能应对变化的系统;提供智能默认值,同时保留需要时的完全控制;并让使用和参与贡献这个库都保持愉快的体验——因此他们特别重视文档和开发者体验。升级大版本会很麻烦吗?重大变更都会附带迁移指南——仓库就发布了升级到 v7 的迁移指南——所以你面对的是有据可查的升级路径,而不是靠自己摸索。
重大变更都会附带迁移指南——仓库就发布了升级到 v7 的迁移指南——所以你面对的是有据可查的升级路径,而不是靠自己摸索。What are similar projects?primitives, ant-design, chakra-ui, tamagui, styled-components, naive-ui, vuetify, primeng
primitives, ant-design, chakra-ui, tamagui, styled-components, naive-ui, vuetify, primengWhich topics is it in?css-in-js, design-systems, ui-kit, ssr, themes, enterprise, component-library, ui-components, customization, ui, web-development, react
css-in-js, design-systems, ui-kit, ssr, themes, enterprise, component-library, ui-components, customization, ui, web-development, react