StyleX · 
StyleX is a JavaScript library for defining styles for optimized user interfaces.
Documentation
Documentation for individual packages can be found in their respective README
files. Start with
@stylexjs/stylex.
Example
Here is a simple example of StyleX use:
import * as stylex from '@stylexjs/stylex';
const styles = stylex.create({
root: {
padding: 10,
},
element: {
backgroundColor: 'red',
},
});
const styleProps = stylex.props(styles.root, styles.element);Development
This is the development monorepo for StyleX.
Structure
.github- Contains workflows used by GitHub Actions.
- Contains issue templates and contribution guidelines.
apps- Contains example apps using StyleX and integration with build tools.
packages- Contains the individual packages managed in the monorepo.
- babel-plugin
- dev-runtime
- eslint-plugin
- nextjs-plugin
- open-props
- rollup-plugin
- shared
- stylex
- webpack-plugin
Tasks
First, npm install the npm workspace.
build- Use
npm run buildto run the build script in every package. - Use
npm run build -w <package-name>to run the build script for a specific package.
- Use
test- Use
npm run testto run tests for every package. - Use
npm run test -w <package-name>to run the test script for a specific package. More details can be found in the contributing guide below.
- Use
Contributing
Development happens in the open on GitHub and we are grateful for contributions including bug fixes, improvements, and ideas.
Code of Conduct
This project expects all participants to adhere to Meta's OSS Code of Conduct. Please read the full text so that you can understand what actions will and will not be tolerated.
Contributing Guide
Read the contributing guide to learn about our development process, how to propose bug fixes and improvements, and how to build and test your changes.
Architectural Principles
Before proposing a change or addition to the StyleX API, you should familiarize yourself with the goals and architectural principles of the project.
License
StyleX is MIT licensed.