eslint-plugin-panda

eslint-plugin-panda copied to clipboard

Getting Started

Installation

pnpm add -D @pandacss/eslint-plugin

Usage

Add @pandacss/eslint-plugin to the plugins section of your .eslintrc configuration file. You can omit the /eslint-plugin suffx:

{
  "plugins": ["@pandacss"]
}

Then configure the rules you want to use under the rules section.

{
  "rules": {
    "@pandacss/no-debug": "error"
  }
}

You can also enable the recommended rules in extends:

{
-   "plugins": ["@pandacss"]
+   "extends": ["plugin:@pandacss/recommended"]
}

Or enable all rules in extends:

{
-   "plugins": ["@pandacss"]
+   "extends": ["plugin:@pandacss/all"]
}

[!WARNING]
This is not recommended. You should only enable the rules you need.

Rules

Rules with ⚙️ have options. Click on the rule to see the options.

Where rules are included in the configs recommended, or all it is indicated below.

Settings

configPath

You can tell eslint to use a custom panda config file by setting the configPath option in your .eslintrc.js file.

By default we find the nearest panda config to the linted file.

const path = require('path')

module.exports = {
  plugins: ['@pandacss'],
  settings: {
    '@pandacss/configPath': path.join('PATH-TO/panda.config.js'),
  },
}