facebook/stylex

这是什么？

核心功能

• 01通过 stylex.create 以 JavaScript 对象的方式定义样式。
• 02通过 stylex.props 将样式应用到页面元素上。
• 03提供 Babel 插件，并支持 PostCSS、Rollup、ESLint 等工具集成。
• 04包含用于构建流程的命令行工具（CLI）。
• 05提供官方文档网站。

适用场景

• 在 React 等 JavaScript 界面项目中，使用与组件同处一地的作用域样式定义。
• 为现有的前端项目通过 Rollup 或 PostCSS 接入构建时样式处理流程。
• 借助 StyleX 的 ESLint 插件在代码库中统一样式规范。

快速上手

1. 1

   从 npm 安装 StyleX 包

   npm install @stylexjs/stylex
2. 2

   使用 stylex.create 定义样式，并用 stylex.props 应用

3. 3

   阅读文档网站了解构建工具配置

使用前须知

• !README 未提供样式编译的配置方法，需要另外配置构建工具集成。
• !这是一个开发用的 monorepo，贡献代码需要安装完整的 yarn 工作区。

标签

常见问题

stylex 是什么？

Facebook 推出的 JavaScript 样式库，用于为用户界面定义经过优化的样式。 StyleX 是一个用于在用户界面中定义样式的 JavaScript 库。开发者通过 stylex.create 声明样式，再用 stylex.props 将其应用到元素上，该函数会返回需要挂载到元素的类名。

stylex 可以免费使用吗？用的什么许可证？

stylex 以 MIT 许可证开源。用于商业产品前，请先确认许可证条款。

stylex 还在维护吗？

活跃维护中。stylex 最近一次提交是在 2026年10月21日。

stylex 适合用来做什么？

在 React 等 JavaScript 界面项目中，使用与组件同处一地的作用域样式定义。 为现有的前端项目通过 Rollup 或 PostCSS 接入构建时样式处理流程。 借助 StyleX 的 ESLint 插件在代码库中统一样式规范。

stylex 怎么安装和运行？

从 npm 安装 StyleX 包: npm install @stylexjs/stylex 使用 stylex.create 定义样式，并用 stylex.props 应用 阅读文档网站了解构建工具配置

在哪里获取 stylex？

源代码和安装说明在 GitHub 上：https://github.com/facebook/stylex