Single ESLint setting for all Lerna sub repositories?

Question

I have heard somewhere that it's possible to create just one ESlint preset for all Lerna subrepositories, but when begin to collect info actively about this did not found clear information.

Why it's attractive

If I want change the settings for ESLint (or TSLint) for all sub-repositories, it takes some time to edit .eslintrc in each project.

The problem

Off course, we can put .eslintrc in the top level of monorepo (at the same level with lerna.json). But when we will open one of sub-repositories in IDE, it will not search .eslintrc outside the project. So I suppose .eslintrc must me in the root of each sub-repository. Does Lerna solve this problem?

Lobell

Did you ever find a solution? I am dealing with this as well – Moslem

@Leon, unfortunately, not yet. Currently I use different ESLint files for each package. From the view point of theory, you can create ESLint preset as package, an inherit all other ESLint configurations from this package. – Lobell

What I is, I created my config in the root of the project, and then created symbolic links into the packages. Form an eslint point of view each project seems to have its own file, but there is actually only one – Moslem

@Leon, I am sorry for by bad English, but my recommendation was different. I recommended you to create the shareable ESLint config in one of 'packages', not in the root of project. Then, create ESLint config in each of another projects and extend it from shareable preset from package. As you know, Lerna will provide access between packages. I am not tried this solution yet, so please sorry if it will not work. – Lobell

Maybe it will work, but my approach is working fine me 😁 – Moslem

@Moslem let us hope that more elegant solution will be developed. – Lobell

I think the best way to deal with this is still: 1. add a root.eslintrc.js, 2. add a new .eslintrc.js in each package folder, 3. add extends: [path.join(__dirname, '../.eslintrc.js')], to each package, 4. customize each file as needed. NOTE that step #4 is important since customization is often inescapable. If you only had one file, it would only work for very homogenous projects, however most projects are not that; e.g. one package is frontend+react, one is a server running on node, one is a cli on node etc etc – Ebonee

Idk why this is so difficult to achieve or why this isn't well-documented :( It's probably the first thing lint/prettier users would look for. – Lascivious

Answer 1

Just create a linter package within your lerna repo, install it in select packages or globally and then reference it via extend from .eslintrc

Theotheobald

could you show an example please? – Dateless

Answer 2

I got this working https://turbo.build/repo/docs/handbook/linting/eslint#our-eslint-config-custom-package. Steps are easy to follow, so I let it explain things.

Not in the link, but:

If you change a rule in eslint-config-custom, you need to either close the file with lint issues or restart the ESLint Service in VSCode (Cmd + Shift + P) for the new lint rule set to take effect.

Some clarity:

Instead of just

{
  "dependencies": {
    "eslint-config-custom": "*"
  }
}

do

yarn add eslint-config-custom

Please check the link first. Coz above are just clarifications on some of the steps.

Lascivious