Repolode
facebook

facebook/stylex

Uma biblioteca de estilos JavaScript do Facebook para definir estilos CSS atômicos e otimizados em interfaces de usuário.

Estrelas
10,424
Forks
502
Issues abertas
239
Último commit
há 8 horas

O que é?

StyleX é uma biblioteca JavaScript para definir estilos em interfaces de usuário. Os desenvolvedores declaram estilos com stylex.create e os aplicam com stylex.props, que retorna os nomes de classe a serem associados aos elementos.

O projeto é um monorepo de desenvolvimento que inclui o pacote principal stylex, além de um plugin Babel, uma CLI, plugins para PostCSS, Rollup e ESLint, um parser de valores de estilo e um site de documentação em stylexjs.com. Os exemplos mostram como integrar a ferramenta a ferramentas de build.

Os estilos são escritos como objetos JavaScript, e as ferramentas os compilam durante a etapa de build.

Recursos principais

  • 01Define estilos como objetos JavaScript com stylex.create.
  • 02Aplica estilos aos elementos por meio de stylex.props.
  • 03Inclui um plugin Babel e integrações para PostCSS, Rollup e ESLint.
  • 04Inclui uma CLI para o fluxo de build.
  • 05Disponibiliza um site oficial de documentação.

Casos de uso

  • Aplicar estilos a uma interface React ou de outra tecnologia JavaScript, com definições de estilo co-localizadas e com escopo definido.
  • Adicionar um pipeline de estilos executado no build a um projeto frontend existente, usando Rollup ou PostCSS.
  • Impor convenções de estilo em uma base de código com o plugin ESLint do StyleX.

Início rápido

  1. 1

    Instale o pacote StyleX pelo npm

    npm install @stylexjs/stylex
  2. 2

    Defina estilos com stylex.create e aplique-os com stylex.props

  3. 3

    Consulte o site da documentação para configurar a ferramenta de build

Antes de usar

  • O README não explica como configurar a compilação dos estilos; a integração com a ferramenta de build precisa ser configurada separadamente.
  • Este é um monorepo de desenvolvimento, então, para contribuir, é preciso instalar todo o workspace do yarn.

Tópicos

Perguntas frequentes

O que é stylex?
Uma biblioteca de estilos JavaScript do Facebook para definir estilos CSS atômicos e otimizados em interfaces de usuário. StyleX é uma biblioteca JavaScript para definir estilos em interfaces de usuário. Os desenvolvedores declaram estilos com stylex.create e os aplicam com stylex.props, que retorna os nomes de classe a serem associados aos elementos.
stylex é gratuito? Qual é a licença?
stylex é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.
stylex ainda é mantido?
Manutenção ativa. O último commit de stylex foi em 21 de out. de 2026.
Para que posso usar stylex?
Aplicar estilos a uma interface React ou de outra tecnologia JavaScript, com definições de estilo co-localizadas e com escopo definido. Adicionar um pipeline de estilos executado no build a um projeto frontend existente, usando Rollup ou PostCSS. Impor convenções de estilo em uma base de código com o plugin ESLint do StyleX.
Como instalar stylex?
Instale o pacote StyleX pelo npm: npm install @stylexjs/stylex Defina estilos com stylex.create e aplique-os com stylex.props Consulte o site da documentação para configurar a ferramenta de build
Onde consigo stylex?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/facebook/stylex

Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.

Projetos relacionados