Sheriff V2 CSS Oppdatering Codemod
Vi har laget en codemod for å oppgradere fra Sheriff v1 over til Sheriff V2.
Det er rykende fersk release candidate versjon, som vi setter pris på om du hjelper oss teste.
Bruk av denne codemoden
Du kan kjøre denne codemoden med følgende kommando:
bash
Codemoden vil automatisk søke gjennom alle JavaScript, TypeScript, JSX, TSX og MDX-filer i prosjektet ditt (unntatt node_modules) og oppdatere CSS-klassene fra V1 til V2.
Husk å ha kodebasen din i en tilstand hvor du kan tilbakestille endringene gjort av Codemoden, i tilfelle noe går galt.
Lokal testing
Du kan kjøre codemoden lokalt med denne kommandoen
bash
Om du vil kjøre codemoden i mappen du står i, så kan du bytte ut $TARGET_FOLDER med .
Hva denne codemoden gjør
Denne codemoden utfører følgende transformasjoner:
1. Konverterer numeriske verdier til t-skjorte-størrelser
Oppdaterer numeriske verdier brukt i V1 i stack- og spacing-klasser til t-skjorte-størrelser som er brukt i V2:
| V1 (Numerisk) | V2 (T-skjorte) |
|---|---|
| 1 | 4xs |
| 2 | 3xs |
| 3 | 2xs |
| 4 | xs |
| 5 | sm |
| 6 | md |
| 7 | lg |
| 8 | xl |
| 9 | 2xl |
| 10 | 3xl |
| 11-14 | 4xl |
2. Oppdaterer radius-klasser
Den samme transformasjonen blir brukt for radius-klasser.
| V1 | V2 | Kommentar |
|---|---|---|
| sds-radius-2 | sds-radius-xs | 0.125rem → 2px |
| sds-radius-4 | sds-radius-sm | 0.25rem → 4px |
| sds-radius-6 | sds-radius-md | 0.375rem → 8px |
3. Oppdaterer fargeklasser
Codemoden oppdaterer en rekke fargeklasser, inkludert:
- Bakgrunnsfarger
- Overflatefarger
- Tekstfarger
- Kantfarger
- Ikonfarger
- Varselfarger (kritisk, advarsel, oppmerksomhet, suksess, info)
Eksempler på før og etter
Stack-klasser
Før
tsx
Etter
tsx
Spacing-klasser
Før
tsx
Etter
tsx
Radius-klasser
Før
tsx
Etter
tsx
Fargeklasser
Før
tsx
Etter
tsx