{"id":19107,"library":"babel-plugin-module-resolver","title":"babel-plugin-module-resolver","description":"A Babel plugin that allows custom module resolution by defining root directories and aliases, eliminating deep relative imports like '../../../../utils'. It simplifies import/require paths for cleaner code. Current stable version is 5.0.3 (July 2024). Release cadence is irregular, with major version bumps occasionally (v4 in 2020, v5 in 2023). Key differentiators: supports both import and require, works with Babel 7+, and integrates with ESLint via eslint-import-resolver-babel-module for linting. Alternative: TypeScript's paths in tsconfig.json but this plugin works for plain JavaScript/Babel projects.","status":"active","version":"5.0.3","language":"javascript","source_language":"en","source_url":"https://github.com/tleunen/babel-plugin-module-resolver","tags":["javascript","babel","babel-plugin","module","resolver","alias","rewrite","resolve","rename"],"install":[{"cmd":"npm install babel-plugin-module-resolver","lang":"bash","label":"npm"},{"cmd":"yarn add babel-plugin-module-resolver","lang":"bash","label":"yarn"},{"cmd":"pnpm add babel-plugin-module-resolver","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"The package itself; optional if using eslint-import-resolver-babel-module separately","package":"babel-plugin-module-resolver","optional":true}],"imports":[{"note":"In .babelrc.js, use require.resolve('babel-plugin-module-resolver') for the plugin. Common mistake: using require directly without resolve.","wrong":"const plugin = require('babel-plugin-module-resolver')","symbol":"default","correct":"import plugin from 'babel-plugin-module-resolver'"},{"note":"resolvePath is a named export for plugin authors. Available since v3. ESM-only in v5+.","wrong":"const { resolvePath } = require('babel-plugin-module-resolver').default","symbol":"resolvePath","correct":"import { resolvePath } from 'babel-plugin-module-resolver'"},{"note":"Type imports for TypeScript users. PluginOptions type can be used in .babelrc.ts.","wrong":"","symbol":"types","correct":"import type { PluginOptions } from 'babel-plugin-module-resolver'"}],"quickstart":{"code":"// .babelrc\n{\n  \"plugins\": [\n    [\"module-resolver\", {\n      \"root\": [\"./src\"],\n      \"alias\": {\n        \"utils\": \"./src/utils\",\n        \"@components\": \"./src/components\"\n      }\n    }]\n  ]\n}\n\n// Before\nimport MyComponent from '../../../../components/MyComponent';\n\n// After\nimport MyComponent from '@components/MyComponent';","lang":"javascript","description":"Configures the plugin in .babelrc with root and alias, then shows a simplified import path."},"warnings":[{"fix":"Prefix alias paths with ./ or ../ to enforce relative resolution, or update alias values to match the new semantics.","message":"V4 changed the way aliases are resolved: paths without leading ./ or ../ are now treated as module names, not relative paths. This may break aliases to npm packages.","severity":"breaking","affected_versions":"4.0.0"},{"fix":"Add eslint-import-resolver-babel-module to your ESLint config and set the same root/alias options.","message":"Plugins can't resolve paths during ESLint linting unless you also configure eslint-import-resolver-babel-module.","severity":"gotcha","affected_versions":">=3.0.0"},{"fix":"Configure Webpack resolve.alias or TypeScript paths separately for runtime.","message":"The plugin does not affect runtime resolution; it only rewrites during Babel transpilation. Ensure your runtime environment has the same module resolution or bundler config.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Replace 'cwd' with 'root' and use absolute paths or './src' relative to project root.","message":"The 'cwd' option (deprecated in v5) will be removed. Use 'root' with absolute paths instead.","severity":"deprecated","affected_versions":"5.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Ensure the alias value is correct and the directory exists. Use absolute paths or './src' relative to project root.","cause":"The alias 'utils' points to a directory that doesn't exist or is not a valid path.","error":"Module not found: Can't resolve 'utils/MyUtilFn' in '/path/to/file'"},{"fix":"Run `npm install --save-dev babel-plugin-module-resolver` or `yarn add --dev babel-plugin-module-resolver`.","cause":"Plugin is not installed as a devDependency.","error":"Error: Cannot find module 'babel-plugin-module-resolver'"},{"fix":"Replace 'cwd' with 'root' and use absolute paths or './src' relative to project root.","cause":"Using the 'cwd' option in plugin configuration.","error":"Error: The 'cwd' option is deprecated and will be removed in future versions."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}