eslint-config-alloy

5.1.2 verified Mon Apr 27 auth: no javascript

AlloyTeam's progressive ESLint config for React/Vue/TypeScript projects, currently at v5.1.2. It lets Prettier handle style and focuses on logical error detection. Supports TypeScript 5.0 since v5.0.0 (breaking: v4.x for TS 4.0), Vue 3.0 since v3.x. High automation: auto-checks for new rules, deprecated rules, and Prettier overlap. Differentiator: rule-per-directory management enabling documentation generation and test-as-document approach.

Common errors

error Error: Failed to load plugin '@typescript-eslint' declared in '.eslintrc.js': Cannot find module '@typescript-eslint/eslint-plugin' ↓

cause Missing peer dependency for TypeScript support.

fix

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

error Error: Cannot find module 'vue-eslint-parser' ↓

cause Missing peer dependency when using Vue config.

fix

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

error Error: Failed to load parser '@babel/eslint-parser' declared in '.eslintrc.js' ↓

cause Missing @babel/eslint-parser when using React config.

fix

npm install --save-dev @babel/eslint-parser @babel/preset-react

error Error: ESLint configuration in `.eslintrc.js` is invalid: Unexpected top-level property "extends" value "alloy/typescript" ↓

cause Using a string instead of array for extends, or missing the base 'alloy' config.

fix

Use extends: ['alloy', 'alloy/typescript']

Warnings

breaking eslint-config-alloy v5.0.0 drops TypeScript 4.x support; requires TypeScript 5.0+. ↓

fix Upgrade TypeScript to >=5.0, or stay on eslint-config-alloy@4 for TS 4.x.

breaking eslint-config-alloy v4.0.0 drops Vue 2.x support; requires Vue 3.0+. ↓

fix Upgrade to Vue 3.0, or use eslint-config-alloy@3 for Vue 2.x.

deprecated The rule `react/jsx-sort-default-props` was removed in v5.0.0. ↓

fix If you rely on this rule, you must add it manually to your project's .eslintrc.

gotcha When using TypeScript, you must install both `@typescript-eslint/parser` and `@typescript-eslint/eslint-plugin` as peer dependencies. Not installing the plugin will cause ESLint to throw an error. ↓

fix Run: npm install --save-dev @typescript-eslint/parser @typescript-eslint/eslint-plugin

gotcha The config disables `no-undef` in TypeScript files (since TS handles that). This can mask real issues if you have JavaScript files in a mixed project. ↓

fix If you need `no-undef` in JS files, ensure you're using a separate config for JS files that does not include the TypeScript preset.

Install

npm install eslint-config-alloy

yarn add eslint-config-alloy

pnpm add eslint-config-alloy

Imports

eslint-config-alloy
wrong
```
module.exports = { extends: ['eslint-config-alloy'] }
```
correct
```
module.exports = { extends: ['alloy'] }
```
In ESLint config, you can omit the `eslint-config-` prefix. Use `alloy` instead of full package name.

alloy/react

wrong

module.exports = { extends: ['alloy/react'] }

correct

module.exports = { extends: ['alloy/react'] }

alloy/vue

wrong

module.exports = { extends: ['alloy/vue'] }

correct

module.exports = { extends: ['alloy/vue'] }

alloy/typescript

wrong

module.exports = { extends: ['alloy/typescript'] }

correct

module.exports = { extends: ['alloy/typescript'] }

alloy/typescript/react

wrong

module.exports = { extends: ['alloy/typescript/react'] }

correct

module.exports = { extends: ['alloy/typescript/react'] }

alloy/typescript/vue

wrong

module.exports = { extends: ['alloy/typescript/vue'] }

correct

module.exports = { extends: ['alloy/typescript/vue'] }

Quickstart

Basic ESLint configuration extending the AlloyTeam TypeScript preset. Customize env, globals, and rules as needed.

// .eslintrc.js
module.exports = {
  extends: [
    'alloy',
    'alloy/typescript',
  ],
  env: {
    // Your environments (which contains globals like __dirname, window, document)
    // List of available envs: https://eslint.org/docs/user-guide/configuring/language-options#specifying-environments
    browser: true,
    node: true,
    // mocha: true,
    // jest: true,
    // jquery: true
  },
  globals: {
    // Your global variables (setting to false means it's not allowed to be reassigned)
    // myGlobal: false
  },
  rules: {
    // Customize your rules
  }
};