eslint-import-resolver-x

This resolver adds TypeScript or JavaScript import support to eslint-plugin-import with tsconfig.json or jsconfig.json aliases (compilerOptions.paths)

Performance

This is fork of eslint-import-resolver-typescript but much faster and more efficient. You can save time on project linting by (~30-40%).

We use strace package for count of fstat call when linting codebase

For example you codebase has multiple packages with 100 000 LOC ()

The following data depends directly on the number of imports in your case, but the comparison table is filled with data on the same code base

syscall	eslint-import-resolver-x	eslint-import-resolver-typescript
access	52 900	50 641
chdir	1	1
execve	78	78
faccessat2	1	1
getcwd	3	3
mkdir	2	2
newfstatat	31 761	32 137 🔺
openat	74 965	81 592 🔺
readlink	1 183 525	1 194 240 🔺
statfs	2	2
statx	1 058 381	11 734 655 🔺
unlink	3	2

We are interested in how many accesses to the file system occurred during the linting process.

For example we can pay attention to statx syscall.

eslint-import-resolver-x makes 10 MILLION fewer statx calls

If you notice an increase in linting performance in your CI on large code bases, write your feedback here

Description

You can:

• import/require files with extension any extenstions of js or ts
• Use paths defined in tsconfig.json or jsconfig.json
• Multiple tsconfigs or jsconfigs support
• imports/exports fields support in package.json

Installation

1# npm
2npm i -D eslint-plugin-import @helljs/eslint-import-resolver-x
3
4# pnpm
5pnpm i -D eslint-plugin-import @helljs/eslint-import-resolver-x
6
7# yarn
8yarn add -D eslint-plugin-import @helljs/eslint-import-resolver-x

Configuration

If you are using eslint-plugin-import-x@>=4.5.0, you can use import/require to reference eslint-import-resolver-x directly in your ESLint flat config:

1// eslint.config.js
2const {
3  createImportResolver,
4} = require('eslint-import-resolver-x')
5
6module.exports = [{
7  settings: {
8    "import/resolver-x": [
9      createImportResolver({
10        alwaysTryTypes: true,
11        project: "path/to/folder",
12        // ...
13      }),
14    ];
15  }
16}]

Add the following to your .eslintrc config:

TypeScript

1{
2  "plugins": ["import"],
3  "rules": {
4    // turn on errors for missing imports
5    "import/no-unresolved": "error",
6  },
7  "settings": {
8    "import/parsers": {
9      "@typescript-eslint/parser": [".ts", ".tsx"],
10    },
11    "import/resolver": {
12      "@helljs/eslint-import-resolver-x": {
13        "alwaysTryTypes": true, // always try to resolve types under `<root>@types` directory even it doesn't contain any source code, like `@types/unist`
14
15        // Choose from one of the "project" configs below or omit to use <root>/tsconfig.json by default
16
17        // use <root>/path/to/folder/tsconfig.json
18        "project": "path/to/folder",
19
20        // Multiple tsconfigs (Useful for monorepos)
21
22        // use a glob pattern
23        "project": "packages/*/tsconfig.json",
24
25        // use an array
26        "project": ["packages/module-a/tsconfig.json", "packages/module-b/tsconfig.json"],
27
28        // use an array of glob patterns
29        "project": ["packages/*/tsconfig.json", "other-packages/*/tsconfig.json"],
30      },
31    },
32  },
33}

JavaScript

1{
2  "plugins": ["import"],
3  "rules": {
4    // turn on errors for missing imports
5    "import/no-unresolved": "error",
6  },
7  "settings": {
8    "import/parsers": {
9      "@babel/eslint-parser": [".js", ".mjs"],
10    },
11    "import/resolver": {
12      "@helljs/eslint-import-resolver-x": {
13        // use <root>/path/to/folder/jsconfig.json
14        "project": "path/to/folder",
15
16        // Multiple jsconfigs (Useful for monorepos)
17
18        // use a glob pattern
19        "project": "packages/*/jsconfig.json",
20
21        // use an array
22        "project": ["packages/module-a/jsconfig.json", "packages/module-b/jsconfig.json"],
23
24        // use an array of glob patterns
25        "project": ["packages/*/jsconfig.json", "other-packages/*/jsconfig.json"],
26      },
27    },
28  },
29}

You can use this resolver for mixed codebase with javascript & typescript:

1"settings": {
2  "import/parsers": {
3    "@babel/eslint-parser": [".js", ".mjs"],
4    "@typescript-eslint/parser": [".ts", ".tsx"],
5  },
6  "import/resolver": {
7    "@helljs/eslint-import-resolver-x": {
8      "project": ["packages/*/tsconfig.json", "packages/*/jsconfig.json"],
9    },
10  },
11}

Options from enhanced-resolve

conditionNames - See default

extensions - See default

extensionAlias - See default

mainFields - See default

Other options

You can pass through other options of enhanced-resolve directly

License

ISC