ESLint Config

UnoCSS-এর জন্য ESLint config: @unocss/eslint-config।

Installation

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

Flat Config Style-এ:

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

export default [
  unocss,
  // other configs
]

Legacy .eslintrc style-এ:

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

Rules

• @unocss/order - Class selectors-এর জন্য একটি নির্দিষ্ট order enforce করে।
• @unocss/order-attributify - Attributify selectors-এর জন্য একটি নির্দিষ্ট order enforce করে।
• @unocss/blocklist - নির্দিষ্ট class selectors নিষিদ্ধ করে [Optional]।
• @unocss/enforce-class-compile - Class compile enforce করে [Optional]।

Optional rules

এই rules default হিসাবে enable করা হয় না। এটি enable করতে, আপনার .eslintrc-এ নিম্নলিখিত যোগ করুন:

{
  "extends": [
    "@unocss"
  ],
  "rules": {
    "@unocss/<rule-name>": "warn", // or "error",
    "@unocss/<another-rule-name>": ["warn" /* or "error" */, { /* options */ }]
  }
}

@unocss/blocklist

blocklist-এ তালিকাভুক্ত utilities matched হলে warning বা error throw করে।

আপনি meta object-এর message property ব্যবহার করে blocked rules-এর জন্য messages customize করতে পারেন যাতে সেগুলি আরও informative এবং context-specific হয়:

export default defineConfig({
  blocklist: [
    ['bg-red-500', { message: 'Use bg-red-600 instead' }],
    [/-auto$/, { message: s => `Use ${s.replace(/-auto$/, '-a')} instead` }], // -> "my-auto" is in blocklist: Use "my-a" instead
  ],
})

@unocss/enforce-class-compile 🔧

এই rule compile class transformer-এর সাথে কাজ করার জন্য ডিজাইন করা হয়েছে।

Class attribute বা directive :uno: দিয়ে শুরু না হলে warning বা error throw করে।

🔧 স্বয়ংক্রিয়ভাবে সমস্ত class attributes এবং directives-এ prefix :uno: যোগ করে।

Options:

• prefix (string) - custom prefix-এর সাথে ব্যবহার করা যেতে পারে। Default: :uno:
• enableFix (boolean) - false হলে gradual migration-এর জন্য ব্যবহার করা যেতে পারে। Default: true

Note: বর্তমানে শুধুমাত্র Vue supported। আপনি যদি এটি JSX-এ চান তাহলে একটি PR contribute করুন। আপনি যদি Svelte-এর জন্য এটি খুঁজছেন, আপনি হয়তো svelte-scoped mode খুঁজছেন।

Prior Arts

@devunt দ্বারা eslint-plugin-unocss-এর জন্য ধন্যবাদ।