Linaria

CSS-in-JS 🔴 Senior

Definition

Librairie CSS-in-JS zero-runtime avec une syntaxe tagged template literals (comme styled-components). Le CSS est extrait au build, zero JS en prod.

Analogie

styled-components qui fait un regime : meme syntaxe, mais sans le poids JavaScript en production.

Exemple de code

import { styled } from '@linaria/react'
import { css } from '@linaria/core'

const title = css`font-size: 2rem; color: blue;`
const Box = styled.div`
  padding: 1rem;
  background: ${() => 'white'};
`

Cas d'usage

Migrer depuis styled-components vers du zero-runtime sans changer la syntaxe.

Termes lies

#styling#css-in-js