stylex

GitHub

StyleX is the styling system for ambitious user interfaces.

9,562 stars JavaScript Markdown Skills CodeWiki
AI Prompts & Endpoints
Agent Skills View CodeWiki Knowledge Base

Repository: facebook/stylex


Stars: 9139

README.md

StyleX · ![GitHub license](https://github.com/facebook/stylex/blob/main/LICENSE) ![npm version](https://www.npmjs.com/package/@stylexjs/stylex) ![tests](https://github.com/facebook/stylex/actions/workflows/tests.yml) ![PRs Welcome](https://github.com/facebook/stylex/blob/main/.github/CONTRIBUTING.md)

StyleX is a JavaScript library for defining styles for optimized user
interfaces.

Documentation

Documentation Website

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:

js
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.
- examples
- Contains examples using StyleX and its integration with build tools.
- packages
- Contains the public and private packages managed in the monorepo.
- babel-plugin
- benchmarks
- cli
- docs
- eslint-plugin
- postcss-plugin
- rollup-plugin
- scripts
- shared
- style-value-parser
- stylex


Tasks

First, yarn install the yarn workspace.

- build
- Use yarn build to run the build script in every package.
- Use yarn workspace <package-name> build to run the build script for a
specific package.
- test
- Use yarn test to run tests for every package.
- Use yarn workspace <package-name> test to run the test script for a
specific package. More details can be found in the contributing guide below.

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.