tsconfig.json "references" is not evaluated

[DrJume]

When reading tsconfig.json, it seems to be ignoring the "references" array which includes paths to other tsconfig files in the same directory.

You can reproduce my repo with npm init vue@3 and then add eslint-plugin-import with this resolver.

[JounQin]

Yep, references is not supported yet, and PR welcome to add notice about it or implement this feature.

[DrJume]

My workaround was to include the referenced tsconfigs in the .eslintrc.js with:

module.exports = {
  // ...,
  settings: {
    'import/resolver': {
      typescript: {
        project: [
          __dirname + '/tsconfig.json',
          __dirname + '/tsconfig.other.json',
        ],
      },
    },
  },
}

[psibean]

My workaround was to include the referenced tsconfigs in the .eslintrc.js with:

module.exports = {
  // ...,
  settings: {
    'import/resolver': {
      typescript: {
        project: [
          __dirname + '/tsconfig.json',
          __dirname + '/tsconfig.other.json',
        ],
      },
    },
  },
}

This didn't seem to solve the problem for me. Any paths defined that are pointing to a reference still don't seem to work, but they work fine if I update their imports to use a relative path instead. Is it possible to see more of your config, or a sample repo?

Would highly appreciate!

[JounQin]

This didn't seem to solve the problem for me. Any paths defined that are pointing to a reference still don't seem to work, but they work fine if I update their imports to use a relative path instead. Is it possible to see more of your config, or a sample repo?

Or maybe you can provide a reproduction instead.

[psibean]

This didn't seem to solve the problem for me. Any paths defined that are pointing to a reference still don't seem to work, but they work fine if I update their imports to use a relative path instead. Is it possible to see more of your config, or a sample repo?

Or maybe you can provide a reproduction instead.

Good point!

I should, given I'm the one with the issue, that is on me. I can't put together a full reproduction right now, but here's a breakdown of my config files.

I have a single root tsconfig.json which is only used for linting:

{
  "compilerOptions": {
    "module": "ESNext",
    "target": "es2020",
    "esModuleInterop": true,
    "noImplicitAny": true,
    "moduleResolution": "node",
    "sourceMap": false,
    "baseUrl": ".",
    "strictNullChecks": true,
    "isolatedModules": false,
    "composite": true,
    "removeComments": true,
    "allowSyntheticDefaultImports": true,
    "paths": {
      "@backend/*": ["./backend/src/*"],
      "@client/*": ["./frontend/src"],
      "@app/*": ["./backend/src/app/*"],
      "@shared-types": ["./shared-types/src/*"],
      "*": ["frontend/node_modules/*", "backend/node_modules/*"],
    },
  },
  "include": [
    "./frontend",
    "./backend",
    "./shared-types"
  ],
}

These paths are replicated in ./backend/tsconfig.json, ./frontend/tsconfig.json, and ./shared-types/tsconfig.json.

And my .eslintrc.cjs looks like this:

module.exports = {
  extends: [
    'eslint:recommended',
  ],
  env: {
    browser: true,
    node: true,
  },
  root: true,
  ignorePatterns: [
    ".*",
    "lib/**/*",
  ],
  parserOptions: {
    sourceType: "module",
    ecmaVersion: 2020
  },
  overrides: [
    {
      files: ["**/*.ts"],
      extends: [
        'eslint:recommended',
        'plugin:@typescript-eslint/recommended',
        'plugin:@typescript-eslint/recommended-requiring-type-checking',
      ],
      parser: '@typescript-eslint/parser',
      parserOptions: {
        tsconfigRootDir: __dirname,
        project: [
          './tsconfig.json',
        ],
        EXPERIMENTAL_useSourceOfProjectReferenceRedirect: true
      },
      plugins: ['@typescript-eslint', 'import'],
      settings: {
        "import/parsers": {
          "@typescript-eslint/parser": [".ts", ".tsx"]
        },
        "import/resolver": {
          "typescript": {
            "project": [
              "tsconfig.json",
              __dirname + "/shared-types/tsconfig.json",
              __dirname + "/backend/tsconfig.json",
              __dirname + "/frontend/tsconfig.json"
            ]
          }
        }
      }
    }
  ]
};

[JounQin]

@psibean Thanks, but you need to provide a minimal but runnable reproduction so that we can help to debug.

[publicJorn]

Hi there, I ran into this issue as well and made a reproduction here: https://github.com/publicJorn/issue-eslint-import-resolver-typescript

It is a vite with react and typescript project, which includes some initial eslint config. I added eslint-import-resolver-typescript and eslint-plugin-import to illustrate the issue.

Note that like DrJume mentioned, the issue can be worked around by adding a projects array. But this is not ideal when creating a shareable eslint config, like I am.

[carlocorradini]

Any update? 😓

[SukkaW]

@carlocorradini The support for referencew in tsconfig.json is still as follows:

Yep, references is not supported yet, and PR welcome to add notice about it or implement this feature.

Feel free to create a PR implementing this and we are more than happy to review it!

[alex-kinokon]

I implemented this. Put this in your patches/eslint-import-resolver-typescript.patch.

diff --git a/lib/index.cjs b/lib/index.cjs
index ea0f8f5978e3ddb43d9d62e8b6e16707ba4f8d64..b1ae381a4dacc0cd6c791133725d11e730c57681 100644
--- a/lib/index.cjs
+++ b/lib/index.cjs
@@ -270,7 +270,7 @@ function initMappers(options) {
       ...globSync([...configPaths.filter((path2) => isGlob(path2)), ...ignore])
     ])
   ];
-  mappers = projectPaths.map((projectPath) => {
+  mappers = projectPaths.flatMap(projectPath => {
     let tsconfigResult;
     if (isFile(projectPath)) {
       const { dir, base } = path.parse(projectPath);
@@ -278,7 +278,22 @@ function initMappers(options) {
     } else {
       tsconfigResult = getTsconfig.getTsconfig(projectPath);
     }
-    return tsconfigResult && getTsconfig.createPathsMatcher(tsconfigResult);
+    if (tsconfigResult) {
+      if (tsconfigResult.config.references) {
+        return [
+          tsconfigResult,
+          ...tsconfigResult.config.references
+            .map(ref => path.resolve(path.dirname(tsconfigResult.path), ref.path))
+            .map(path => ({ path, config: getTsconfig.parseTsconfig(path) }))
+            .filter(Boolean),
+        ]
+          .map(tsconfigResult => getTsconfig.createPathsMatcher(tsconfigResult))
+          .filter(Boolean);
+      } else {
+        return getTsconfig.createPathsMatcher(tsconfigResult);
+      }
+    }
+    return tsconfigResult;
   });
   mappersCachedOptions = options;
 }

[carlocorradini]

@alex-kinokon What do you think about implementing this and creating a PR?

PS: Take a look at PR #345

[alex-kinokon]

I don’t have time to write the test for this. Feel free to use my diff and create a pull request yourself.

Edit: Submitted a PR, but still no time to write test.

[MichailShcherbakov]

Any updates?

[JounQin]

See #368, in next major references will be supported.

And you can try it out today.

#368 (comment)