ESLint Konfiguracija

ESLint konfiguracija za UnoCSS: @unocss/eslint-config.

Namestitev

pnpm

pnpm add -D @unocss/eslint-config

yarn

yarn add -D @unocss/eslint-config

npm

npm install -D @unocss/eslint-config

bun

bun add -D @unocss/eslint-config

V Flat Config slogu:

import unocss from '@unocss/eslint-config/flat'

export default [
  unocss,
  // druge konfiguracije
]

V legacy .eslintrc slogu:

{
  "extends": [
    "@unocss"
  ]
}

Pravila

• @unocss/order - Vsili določen vrstni red za razredne selektorje.
• @unocss/order-attributify - Vsili določen vrstni red za atributivne selektorje.
• @unocss/blocklist - Prepove določene razredne selektorje [izbirno].
• @unocss/enforce-class-compile - Vsili kompilacijo razredov [izbirno].

Izbirna pravila

Ta pravila niso privzeto omogočena. Za njihovo omogočitev dodajte naslednje v vaš .eslintrc:

{
  "extends": [
    "@unocss"
  ],
  "rules": {
    "@unocss/<rule-name>": "warn", // ali "error",
    "@unocss/<another-rule-name>": ["warn" /* ali "error" */, { /* možnosti */ }]
  }
}

@unocss/blocklist

Vrže opozorilo ali napako, ko se ujemajo pripomočki, navedeni v blocklist.

Sporočila za blokirana pravila lahko prilagodite, da bodo bolj informativna in specifična za kontekst, z uporabo lastnosti message meta predmeta:

export default defineConfig({
  blocklist: [
    ['bg-red-500', { message: 'Uporabi bg-red-600 namesto' }],
    [/-auto$/, { message: s => `Uporabi ${s.replace(/-auto$/, '-a')} namesto` }], // -> "my-auto" je v blocklist: Uporabi "my-a" namesto
  ],
})

@unocss/enforce-class-compile 🔧

To pravilo je zasnovano za delo v kombinaciji s transformerjem za kompilacijo razredov.

Vrže opozorilo ali napako, ko se atribut razreda ali direktiva ne začne z :uno:.

🔧 samodejno doda predpono :uno: vsem atributom razreda in direktivam.

Možnosti:

• prefix (niz) - lahko se uporabi v kombinaciji s prilagojeno predpono. Privzeto: :uno:
• enableFix (boolean) - lahko se uporabi za postopno migracijo, ko je false. Privzeto: true

Opomba: trenutno je podprt le Vue. Prispevajte PR, če želite to v JSX. Če iščete to v Svelte, si morda ogledujete način svelte-scoped.

Predhodna dela

Hvala eslint-plugin-unocss od @devunt.