Skip to content

GreenPie/eslint-config-greenpie

Repository files navigation

Pretty tough linting configs

npm version

This package provides ESLint's shared config that designed to be strict as hell.

Usage

Install the base package with required dependencies:

npm install eslint-config-greenpie eslint --save-dev

Then install additional dependencies depending on your use case:

For oxlint users:

npm install oxlint --save-dev

For ESLint users:

npm install @stylistic/eslint-plugin --save-dev

For TypeScript projects:

npm install typescript-eslint --save-dev

For Vue.js projects:

npm install eslint-plugin-vue --save-dev

Oxlint configuration

If using oxlint, create a .oxlintrc.jsonc file in the root of your project with the following content:

{
  "$schema": "./node_modules/oxlint/configuration_schema.json",

  "extends": [
    "./node_modules/eslint-config-greenpie/configs/oxlintrc.jsonc"
  ]
}

Oxlint CLI

Run oxlint with the following command:

oxlint

Note: The shared config has reportUnusedDisableDirectives enabled by default to prevent cluttering your project with unnecessary disable directives. If needed, you can override this in your local .oxlintrc.jsonc:

{ "options": { "reportUnusedDisableDirectives": "off" } }

ESLint configuration

import { defineConfig } from 'eslint/config';
import { configs } from 'eslint-config-greenpie';

export default defineConfig(
  ...configs.default,
  ...configs.vue
);

See more examples below.

Config (oxlint)

Oxlint has one unified configuration for all supported languages (.js, .ts, .vue). You can granularly configure it in your local .oxlintrc.jsonc file.

Related ESLint rules are disabled by default if supported by oxlint.

Configs (ESLint)

Config Description
default Includes js and ts configs
js Includes JavaScript rules
ts Includes TypeScript rules
vue Includes rules for Vue.js

Configuration examples

Oxlint

{
  "$schema": "./node_modules/oxlint/configuration_schema.json",

  "extends": [
    "./node_modules/eslint-config-greenpie/configs/oxlintrc.jsonc"
  ],

  "rules": {
    "eslint/no-magic-numbers": "off",
  },

  "overrides": [{
    "files": ["src/**/*.{ts,vue}"],

    "env": {
      "browser": true
    }
  }, {
    "files": ["vite.config.mts"],

    "env": {
      "node": true
    }
  }]
}

JS/TS rules

import { configs } from 'eslint-config-greenpie';

export default [
  ...configs.js
];

JS + Vue

import { configs } from 'eslint-config-greenpie';

export default [
  ...configs.js,
  ...configs.vue
];

JS + TS + Vue

You will probably need to configure another parser for the <script> tag.

import { configs } from 'eslint-config-greenpie';

export default [
  ...configs.default,
  ...configs.vue
];

Tips

Allow short identifiers for id-length

The eslint/id-length rule enforces minimum identifier length (default: 2). If your project has legitimate short identifiers, add only those in your local .oxlintrc.jsonc.

{
  "extends": [
    "./node_modules/eslint-config-greenpie/configs/oxlintrc.jsonc"
  ],

  "rules": {
    "eslint/id-length": ["error", {
      "max": 40,

      "exceptions": [
        "t", // translation function, e.g. from vue-i18n
        "v"  // valibot schema builder, e.g. `v.string()`, `v.object({...})`, etc.
      ]
    }]
  }
}

Allow namespace imports for specific packages

The import/no-namespace rule disallows import * as syntax. If you need to use namespace imports for a specific package (e.g. valibot), you can override the rule in your local .oxlintrc.jsonc:

{
  "extends": [
    "./node_modules/eslint-config-greenpie/configs/oxlintrc.jsonc"
  ],

  "rules": {
    "import/no-namespace": ["error", {
      "ignore": ["valibot"]
    }]
  }
}

Links

Development

Running tests

npm run test

Tests use Vitest and the ESLint programmatic API to lint code snippets directly against the configs defined in this repository.

Packages

 
 
 

Contributors