# Rebilly shared eslint configs

These are the shared ESLint 9 flat configs for all Rebilly frontend projects.

Where possible, we should exclusively try to spread these configs and
avoid adding overrides in our projects. This will keep the projects consistent and
reduce the difficulty when switching between projects.

## Usage

1. Install the package in the project: `pnpm add -D @rebilly/eslint-config@workspace:*`
2. Create an `eslint.config.cjs` file in the project root:

```js
const vueConfig = require('@rebilly/eslint-config/vue');

module.exports = [...vueConfig];
```

## Configs

| Config     | Import                              | Description                                                                   |
| ---------- | ----------------------------------- | ----------------------------------------------------------------------------- |
| Base       | `@rebilly/eslint-config`            | Base config for all projects, containing generic JavaScript and Vitest rules. |
| TypeScript | `@rebilly/eslint-config/typescript` | TypeScript projects.                                                          |
| Vue        | `@rebilly/eslint-config/vue`        | Vue 3 projects written in TypeScript.                                         |

## Flat Config Format

ESLint 9 uses a flat config format. Key differences from the old `.eslintrc.*` format:

- No more `extends` - import and spread configs directly
- No more `env` - use `globals` package with `languageOptions.globals`
- No more `overrides` - use separate config objects with `files` property
- Explicit plugin imports instead of string references

### Example with custom rules

```js
const globals = require('globals');
const vueConfig = require('@rebilly/eslint-config/vue');

module.exports = [
  ...vueConfig,
  {
    languageOptions: {
      globals: {
        ...globals.browser,
        myGlobal: 'readonly',
      },
    },
    rules: {
      'no-console': 'warn',
    },
  },
  // Override for specific files
  {
    files: ['**/*.spec.ts'],
    rules: {
      'no-console': 'off',
    },
  },
];
```

## Prettier

Prettier is no longer integrated into ESLint. Run Prettier separately as a formatting tool.
