eslint error when enabling tseslint type checked and ignoring the eslint.config.js file

Question

I am trying to configure eslint for typescript with type checking and just can't make it work. If add ...tseslint.configs.recommendedTypeChecked and ignore the eslint.config.js file I get the following error:

Error: Error while loading rule '@typescript-eslint/await-thenable': 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.
Parser: undefined
Note: detected a parser other than @typescript-eslint/parser. Make sure the parser is configured to forward "parserOptions.project" to @typescript-eslint/parser.
Occurred while linting /home/...
...

Bellow are all the files that might be relevant:

eslint.config.js

// @ts-check

import eslint from "@eslint/js";
import tseslint from "typescript-eslint";
import eslintConfigPrettier from "eslint-config-prettier";
import globals from "globals";

export default tseslint.config(
  eslint.configs.recommended,
  ...tseslint.configs.recommendedTypeChecked,
  eslintConfigPrettier,
  {
    plugins: {
      "@typescript-eslint": tseslint.plugin,
    },
    languageOptions: {
      parser: tseslint.parser,
      parserOptions: {
        project: true,
        tsconfigRootDir: import.meta.dirname,
      },
      globals: {
        ...globals.node,
      },
    },
    ignores: ["**/dist/**", "**/node_modules/**", "**/eslint.config.js"],
    files: ["src/**/*.ts"],
  },
  {
    rules: {
      "@typescript-eslint/no-unused-vars": "warn",
    },
  },
);

tsconfig.json

{
  "extends": "@tsconfig/node20/tsconfig.json",
  "include": ["src"],
  "compilerOptions": {
    "outDir": "dist"
  }
}

prettier.config.js

/** @type {import("prettier").Config} */

const config = {
  experimentalTernaries: true,
  proseWrap: "always",
};

export default config;

The reason I am ignoring the eslint.config.js file is to avoid the "ESLint was configured to run ... However, that TSConfig does not / none of those TSConfigs include this file", as recommended in the FAQs here and resolved here

Answer 1

I believe the issue above is due the way ignores and files configuration keys work. Specifically, files I believe cannot be applied globally and ignores only applies globally when used without any other keys. In my original configuration ...tseslint.configs.recommendedTypeChecked is applied to all files but the parser only applies to ts files inside the src directory.

I have done this again from the ground up and the bellow does not give any more errors or warnings:

// @ts-check

import eslint from "@eslint/js";
import tseslint from "typescript-eslint";
import prettier from "eslint-config-prettier";
import globals from "globals";

export default tseslint.config(
  // global ignores
  {
    ignores: ["dist/", "node_modules/"],
  },

  // applies to everything
  eslint.configs.recommended,

  // applies only to ts files
  {
    name: "tseslint",
    files: ["src/**/*.ts"],
    extends: [
      //
      ...tseslint.configs.recommendedTypeChecked,
      ...tseslint.configs.strictTypeChecked,
    ],
    plugins: {
      "@typescript-eslint": tseslint.plugin,
    },
    languageOptions: {
      parser: tseslint.parser,
      parserOptions: {
        project: true,
      },
    },
    rules: {
      "@typescript-eslint/no-unused-vars": "warn",
    },
  },

  // global variables, applies to everything
  {
    languageOptions: {
      globals: {
        ...globals.node,
      },
    },
  },

  // prettier config
  prettier
);