Kevin Powell - Community•2y ago

Eslint: Unresolved Module Errors in "Monorepo"

Hi, I have set up a project containing two separate sub-projects, one for my headless CMS and one for the frontend. Before then all modules for custom paths (set up in the tsconfig.json) did correctly resolve, but now that the root is no longer in the project root, but in the astro sub-directory it can no longer resolve them. Everything still works, except for eslint complaining, and CMD-Clicking the paths opens the right file as well. I know it is hard to figure this out without seeing the actual project, so here it is: https://github.com/lokkeestudios/lokkeestudios I have been trying to get this working for a while now and I am afraid, but I really am not an expert when it comes to setting up eslint. So help on this is very much appreciated! 😊

7 Replies

theoriginalandrew•2y ago

What happens when you drop the @? you don't really have a monorepo set up here, i'm thinking that you just have imported something wrong. A monorepo would have a workspaces array i the root package.json where the array holds all of the different "workspaces" or sub repos to work from, which your package.json doesn't have.

LOKKEEOP•2y ago

that's why I put it in quotation marks, I know it isn't really a monorepo, but I still have two subprojects in one root project, which does make a difference when setting up eslint and such. e.g. I had to add the tsconfigRootDir to __dirname in order for it to find the tsconfig.eslint.json

theoriginalandrew•2y ago

the @component seems to be a bit weird for an import - that might be the root problem

LOKKEEOP•2y ago

when I drop the @ and use a relative path like ../../utils/formatDate it works though I tried moving the astro subproject into its own project, where it is in the root and then everything worked so it is definitely caused by the fact, that the files don't live in the root of the project furthermore, there are no issues using absolute paths like @utils/formatDate in .ts and .tsx files either, only in .astro ones as you can see I have an override in the .eslintrc for .astro files as well, maybe I did something wrong there? I mean, as I already mentioned, the exact same config setup (tsconfig.json, tsconfig.eslint.json and .eslintrc) worked in all my projects, where all files lived in the root directory, before please let me know, if I can provide you any further information @Andrew I have been trying to get the gist of this for several days now and I really don't understand what's going wrong, maybe you understand me

theoriginalandrew•2y ago

Yeah, i'm about to hop in a dev meeting at work but i'll look into it more after if thats ok 🙂

LOKKEEOP•2y ago

sure thing! 🙂 I am not pinging you since I guess you are currently busy with your meeting, but I finally could figure it out and it all came down to setting the project property of the typescript import resolver from the point of view of the root directory (so astro/tsconfig.eslint.json), like so:

settings: {
    'import/resolver': {
      typescript: {
        project: 'astro/tsoconfig.json',
      },
    },
  },

settings: {
    'import/resolver': {
      typescript: {
        project: 'astro/tsoconfig.json',
      },
    },
  },

Thank you once more for your kind help! 🙂

theoriginalandrew•2y ago

Nice! Sorry, had to hop offline right after the meeting unexpectedly but i'm happy you were able to solve it

Gaming

Programming

Eslint: Unresolved Module Errors in "Monorepo"