Disable rules of TS for TS files only

[xyy94813]

Provide better support in projects where both js and ts exist

[lydell]

Hi! I don’t think this is needed. Can you give an example where this solved a problem for you?

[xyy94813]

When I use @typescript-eslint/parser to process only ts(x) files.

Same as: https://github.com/facebook/create-react-app/blob/main/packages/eslint-config-react-app/index.js

module.exports = {
  extends: [
    'airbnb',
    'plugin:prettier/recommended',
  ],
  rules: {
    'prettier/prettier': ['error', {
      // same as eslint-config-airbnb
      singleQuote: true,
      arrowParens: 'avoid',
      tabWidth: 2,
      printWidth: 100, 
      trailingComma: 'all',
    }, {
      usePrettierrc: false,
    }],
  },
  overrides: [
    {
      files: ['**/*.ts?(x)'],
      parser: '@typescript-eslint/parser',
      parserOptions: {
        ecmaVersion: 2018,
        sourceType: 'module',
        ecmaFeatures: {
          jsx: true,
        },
        project: path.join(__dirname, './tsconfig.json'),
        // typescript-eslint specific options
        warnOnUnsupportedTypeScriptVersion: true,
      },
      plugins: ['@typescript-eslint'],
      extends: [
        'airbnb-typescript', 
        // 'prettier', // close conflict rules
      ],
    },
  ],
  settings: {},
};

[lydell]

I put your config in a .eslintrc.js file and then wasted 10 minutes reverse engineering which packages to install and adding the missing path import. I uncommented the // 'prettier', // close conflict rules line and eslint . seemed to work just fine.

Can you create a small repo with clear instructions on how to reproduce the problem you have? And tell me what the actual problem is?

[xyy94813]

The comment is a trick way.

What i finally expected is that:

// .eslintrc.js
const path = require('path');

module.exports = {
  extends: [
    'airbnb',
    'airbnb-typescript', 
    'plugin:prettier/recommended',
  ],
  rules: {
    'prettier/prettier': ['error', {
      // same as eslint-config-airbnb
      singleQuote: true,
      arrowParens: 'avoid',
      tabWidth: 2,
      printWidth: 100, 
      trailingComma: 'all',
    }, {
      usePrettierrc: false,
    }],
  },
  overrides: [
    {
      files: ['**/*.ts?(x)'],
      // ...
      plugins: ['@typescript-eslint'],
      parserOptions: {
        // ...
        project: path.join(__dirname, './tsconfig.json'),
        // typescript-eslint specific options
        warnOnUnsupportedTypeScriptVersion: true,
      },
      // ...
    },
  ],
  settings: {},
};

1. Since I only use @typescript-eslint/parser for ts(x) files, there is an error with the option that only applies to certain rules in ts files, like this.

   Error: Error while loading rule '@typescript-eslint/dot-notation': You have used a rule which requires parserServices to be generated. You must therefore provide a value for the "parserOptions.project" property for @typescript-eslint/parser.

2. since eslint-config-airbnb-typescript works on all files, I can only use `eslint-config-airbnb-typescript by override
3. since 2, eslint-config-airbnb-typescript will cause eslint-config-prettier to fail, so I have to use eslint-config-prettier by override again.

The current implementation works, but I don't think it's the best.

[xyy94813]

em... Maybe I just need to modify the eslint-config-airbnb-typescript

[lydell]

Closing since no reason for this change was presented.