The error: import/extensions not found
You open a TypeScript file in VS Code and the Problems pane shows Definition for rule 'import/extensions' was not found.eslint(import/extensions) — and on the next line, Definition for rule 'import/no-extraneous-dependencies' was not found.eslint(import/no-extraneous-dependencies). Both the import/extensions and import/no-extraneous-dependencies rules are defined by eslint-plugin-import; eslint-plugin-import also declares eslint in its peerDependencies, so a compatible ESLint version is required. The root cause is that eslint-plugin-import is installed but never registered as a plugin in your ESLint config. The fix: add "import" to the plugins array and "airbnb-base" to extends before "airbnb-typescript/base". This answer comes from a Stack Overflow thread.
Why your config lost the import rules
The break happens because eslint-config-airbnb-typescript released a breaking change in version 13. Before v13, the package bundled eslint-config-airbnb-base and its peer dependencies — including eslint-plugin-import — so simply extending airbnb-typescript/base was enough. After v13, the bundling stopped. You must now install eslint-config-airbnb-base and eslint-plugin-import yourself, and explicitly add airbnb-base to your extends array.
Even if eslint-plugin-import sits in your devDependencies, ESLint does not load it automatically. ESLint only loads plugins listed in the plugins array of your config file, or plugins referenced by a shared config's plugins entry. When the airbnb-typescript/base config references rules like import/extensions but the import plugin is not loaded, ESLint fails to resolve the rule and prints Definition for rule 'import/extensions' was not found. The OP's config illustrates both mistakes:
{
"env": {
"es2021": true,
"node": true
},
"extends": [
"airbnb-typescript/base",
"plugin:@typescript-eslint/recommended"
],
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaVersion": 12,
"sourceType": "module",
"project": "./tsconfig.json"
},
"plugins": [
"@typescript-eslint"
],
"rules": {
"@typescript-eslint/no-use-before-define": "off"
}
}
Notice two things: the plugins array contains only @typescript-eslint, and extends does not include airbnb-base. Both omissions need to be fixed. If your project uses TypeScript path aliases, you may also need to configure a resolver for eslint-plugin-import; see Fix tsconfig Paths Not Working in Next.js for how to wire import/resolver.
The fix: add import to plugins and airbnb-base to extends
The minimal change is shown in this diff:
{
"env": {
"es2021": true,
"node": true
},
"extends": [
+ "airbnb-base",
"airbnb-typescript/base",
"plugin:@typescript-eslint/recommended"
],
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaVersion": 12,
"sourceType": "module",
"project": "./tsconfig.json"
},
"plugins": [
+ "import",
"@typescript-eslint"
],
"rules": {
"@typescript-eslint/no-use-before-define": "off"
}
}
The critical insertion is "import" in the plugins array. That tells ESLint to load eslint-plugin-import and makes all import/* rule names resolvable. Adding airbnb-base to extends fulfills the peer requirement introduced in eslint-config-airbnb-typescript v13 and ensures the full Airbnb rule set is active. If you prefer a shorter config, you can replace the plugins addition with "extends": ["plugin:import/recommended"] — that shared config registers the plugin implicitly.
Before editing the config, run this command to install the missing peer dependencies:
npx install-peerdeps --dev eslint-config-airbnb-base
This installs both eslint-config-airbnb-base and eslint-plugin-import, and updates package.json devDependencies like this:
{
"devDependencies": {
"eslint": "^8.7.0",
"eslint-config-airbnb-base": "^15.0.0",
"eslint-plugin-import": "^2.25.4"
}
}
If you already have eslint-plugin-import but it is the wrong major version, npx install-peerdeps will align it. After running the command, verify that eslint-plugin-import appears in node_modules and is listed under devDependencies in package.json.
A common follow-up error is import/no-unresolved pointing at modules that TypeScript resolves but ESLint does not. That happens when eslint-plugin-import cannot map TypeScript path aliases from tsconfig.json. The fix involves adding eslint-import-resolver-typescript and configuring settings, which is covered in depth in Fix "Could Not Find Declaration File for Module".
Verify the fix
After updating .eslintrc.json, restart the ESLint server in VS Code so the extension re-reads your config. Open the Command Palette with Ctrl+Shift+P (Windows/Linux) or Cmd+Shift+P (macOS), then run ESLint: Restart ESLint Server. Check the Problems pane — the import/extensions and import/no-extraneous-dependencies errors should disappear immediately.
For a terminal check, run ESLint on a TypeScript file:
npx eslint src/index.ts
With the fix in place, you should see no Definition for rule messages. Instead, ESLint will evaluate the import rules normally. If you intentionally break an import rule — for example, by adding an unnecessary file extension in an import — you should now get a proper error from import/extensions, confirming the rule is active:
src/index.ts
1:19 error Unexpected use of file extension "ts" for import "./helper.ts" import/extensions
If you still see the Definition for rule error, two common variants remain.
Variant A: eslint-plugin-import is installed but not in plugins
This is the OP's exact situation. The package exists in node_modules and package.json, but ESLint ignores it because it is not registered. Add "import" to the plugins array in your .eslintrc.json as shown in the diff above, then restart ESLint.
Variant B: airbnb-base is missing from extends
Even if you register the plugin, airbnb-typescript/base v13 no longer pulls in airbnb-base. The result is that some rules referenced by the shared config are not defined. Add "airbnb-base" immediately before "airbnb-typescript/base" in the extends array in your .eslintrc.json, as the diff shows. If you still see Definition for rule 'import/no-extraneous-dependencies' was not found, that error is due to eslint-plugin-import not being registered in the plugins array — airbnb-base only configures that rule, it does not define it. Registering "import" in the plugins array resolves that specific error.
Why this happens (and how to avoid it next time)
The underlying invariant is simple: ESLint only knows about rules from plugins that are explicitly loaded. A config like airbnb-typescript/base may reference import/* rules, but unless the import plugin is loaded, those references are unresolved strings. The eslint-config-airbnb-typescript v13 breaking change removed the implicit dependency on airbnb-base and its peer eslint-plugin-import, forcing every project to declare both explicitly.
To keep this from recurring, add a lint step to your CI that runs npm install then npx eslint . --max-warnings=0. If the config is missing a required plugin, the lint step fails immediately with the Definition for rule error, catching the mistake before it reaches a developer's editor. If your project uses TypeScript, also consider running tsc --noEmit alongside ESLint — many import-resolution errors that look like ESLint problems are actually TypeScript path or declaration issues; the article Fix "Property does not exist on Window" in TypeScript covers a closely related symptom.
FAQ
Why am I getting "Definition for rule import/extensions was not found"?
Because eslint-plugin-import is not loaded. ESLint cannot resolve a rule name like import/extensions unless the plugin that defines it is registered in the plugins array (or pulled in via a shared config). Add "import" to plugins or extend "plugin:import/recommended".
How do I fix ESLint rule import/extensions not found?
Register the import plugin: add "import" to the plugins array in your ESLint config. Also ensure eslint-plugin-import is installed as a devDependency — run npx install-peerdeps --dev eslint-config-airbnb-base if needed. If you use eslint-config-airbnb-typescript v13 or later, add "airbnb-base" to extends before "airbnb-typescript/base".
Does eslint-config-airbnb-typescript require eslint-plugin-import to be installed separately?
Yes. Starting with version 13, eslint-config-airbnb-typescript no longer lists eslint-plugin-import as a transitive dependency. You must install it directly and also add eslint-config-airbnb-base (and its peer eslint-plugin-import) to your project. The easiest way is npx install-peerdeps --dev eslint-config-airbnb-base.
Why does my tsconfig.json affect ESLint import rules?
eslint-plugin-import uses Node resolution by default. If your tsconfig.json defines paths or baseUrl, the plugin does not see those unless you add a resolver like eslint-import-resolver-typescript and configure settings. See Fix tsconfig Paths Not Working in Next.js for a complete setup.
Related
- Fix tsconfig Paths Not Working in Next.js
- Fix "Could Not Find Declaration File for Module"
- Fix "Property does not exist on Window" in TypeScript
- Fix An index signature parameter type cannot be a union
Originally published at https://www.iloveblogs.blog
