Add Typescript ESLint plugin to the examples

[la55u]

Describe the feature you'd like to request

I'd like to request some sort of guide on how to setup Typescript ESlint plugin.

I am unable to set up Typescript ESlint following this guide with the monorepo structure detailed in the Turborepo examples because it's not clear how to use it when both eslint and tsconfig files are inside packages. My preferred setup would be to extend plugin:@typescript-eslint/recommended-requiring-type-checking to leverage the power of Typescript in linting.

Here's what I tried: https://github.com/la55u/turborepo-kitchen-sink

1. Start from the kitchen-sink example
2. Added @typescript-eslint/parser and @typescript-eslint/eslint-plugin to the eslint-config-custom/package.json
3. Modified eslint-config-custom/index.js to:

index.js

```module.exports = { extends: [ "next", "turbo", "prettier", "plugin:@typescript-eslint/recommended", "plugin:@typescript-eslint/recommended-requiring-type-checking", ], parser: "@typescript-eslint/parser", plugins: ["@typescript-eslint"], parserOptions: { tsconfigRootDir: __dirname, project: ["**/packages/**/tsconfig.json"], }, settings: { react: { version: "detect", }, }, }; ```

4. Run yarn run lint

I get the following error which I am unable to solve (I already because I already added this option).

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.

It seems like a common usecase to incude this plugin yet there is no docs on it how to use it, I think it would be nice to add it.

Describe the solution you'd like

Add plugin:@typescript-eslint/recommended-requiring-type-checking, to all the examples or create a separate example for it or just make a guide in the docs for how to use them in a monorepo setup where the tscondig and eslint configs are both in a shared package.

Describe alternatives you've considered

Leave it to the user to figure out which is obviously not ideal in my opinion.

[iduuck]

Please read this for information about how to setup typescript-eslint with a monorepo: https://typescript-eslint.io/docs/linting/typed-linting/monorepos/#one-tsconfigjson-per-package-and-an-optional-one-in-the-root

[la55u]

I've read it as you can see in my example I tried to add parserOptions to the lint config but it doesn't work. What am I doing wrong? Thank you

[raphaelluchini]

@la55u I am facing the same problem.

When using plugins in extensions, ESLint does not use the package context of the extension. It uses a package from where the lint is being executed. That means I must add all plugins to every package that uses my custom extension.

I'd be interested in a solution for that as well

[georgiosd]

This is blocking from adopting turborepo also. I wonder what other people are doing that this isn't a problem!

[georgiosd]

@la55u @raphaelluchini I think I figured it out, with the help of @itsUndefined

Don't define the parserOptions inside the custom package, do it inside the library using it!

EDIT: If you're using yarn 3 like me, it seems to require nodeLink: node-modules