Using a different .eslintrc config file for typescript and javascript in VSCode?

Question

I have a project with both JS and TS files (and JSX/TSX). I have a separate .eslintrc.json file for JS vs. TS. I'd like to be able to tell VSCode which eslint config file to use depending on the file extension.

Tried putting the settings in settings.json under the [typescript] field but that didn't work.

Answer 1

I think it should be possible to use 1 file and overrides option:

.eslintrc.js

module.exports = {
    "root": true,
    "plugins": ["@typescript-eslint"],
    "rules": {
        // JavaScript rules
    },
    "overrides": [
        {
            "files": ["*.ts", "*.tsx"],
            "parser": "@typescript-eslint/parser",
            "parserOptions": {
                "project": "./tsconfig.json"
            },
            "plugins": [
                "@typescript-eslint"
            ],
            "rules": {
                // TypeScript rules
            }
        }
    ]
}

And changing workspace settings:

"eslint.validate": [
    {
        "language": "typescript",
        "autoFix": true
    },
    {
        "language": "typescriptreact",
        "autoFix": true
    }
]