{"id":20624,"library":"tsconfig-paths-webpack-plugin","title":"tsconfig-paths-webpack-plugin","description":"A webpack resolve plugin that automatically creates alias entries based on the `paths` and `baseUrl` in your `tsconfig.json`, eliminating the need to manually duplicate those mappings in your webpack config. Version 4.2.0 supports webpack 5+ and ships TypeScript types. Stable, widely used in TypeScript monorepos and migration scenarios. Distinct from manual alias configuration or alternative tools like `tsconfig-paths` as it integrates directly into webpack's resolution pipeline.","status":"active","version":"4.2.0","language":"javascript","source_language":"en","source_url":"https://github.com/dividab/tsconfig-paths-webpack-plugin","tags":["javascript","typescript"],"install":[{"cmd":"npm install tsconfig-paths-webpack-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add tsconfig-paths-webpack-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add tsconfig-paths-webpack-plugin","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Core dependency that parses tsconfig.json and resolves paths","package":"tsconfig-paths","optional":false},{"reason":"Used for colored console output in log messages (optional via `colors: false`)","package":"chalk","optional":true}],"imports":[{"note":"Default export; CommonJS require works directly without .default in v4, but using import is preferred for TypeScript.","wrong":"const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin').default","symbol":"TsconfigPathsPlugin","correct":"import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin'"},{"note":"Versions <4 required named import via 'import { TsconfigPathsPlugin }' but v4 changed to default export. Named import will fail.","wrong":"import { TsconfigPathsPlugin } from 'tsconfig-paths-webpack-plugin'","symbol":"TsconfigPathsPlugin","correct":"const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin')"},{"note":"Options type is exported as a named type; use 'import type' for TypeScript to avoid runtime issues.","wrong":"import { TsconfigPathsPluginOptions } from 'tsconfig-paths-webpack-plugin'","symbol":"type TsconfigPathsPluginOptions","correct":"import type { TsconfigPathsPluginOptions } from 'tsconfig-paths-webpack-plugin'"}],"quickstart":{"code":"// webpack.config.cjs\nconst TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');\n\nmodule.exports = {\n  resolve: {\n    plugins: [\n      new TsconfigPathsPlugin({\n        configFile: './tsconfig.json',\n        extensions: ['.ts', '.tsx', '.js', '.jsx'],\n        silent: true\n      })\n    ]\n  }\n};","lang":"javascript","description":"Basic webpack configuration adding the plugin to resolve.plugins with common options."},"warnings":[{"fix":"Replace `import { TsconfigPathsPlugin } from 'tsconfig-paths-webpack-plugin'` with `import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin'`.","message":"Version 4 changed the plugin from a named export to a default export.","severity":"breaking","affected_versions":">=4.0.0"},{"fix":"Upgrade to webpack 5 or use tsconfig-paths-webpack-plugin@3 for webpack 4.","message":"Version 4 requires webpack 5+; webpack 4 support dropped.","severity":"breaking","affected_versions":">=4.0.0"},{"fix":"Use `silent: true` instead of `logLevel: 'warn'`.","message":"The `logLevel` option may be removed in future; prefer `silent: true` to suppress logs.","severity":"deprecated","affected_versions":">=4.0.0"},{"fix":"Update Node.js to >=10.13.0 or use tsconfig-paths-webpack-plugin@3.","message":"Node.js >=10.13.0 required; older versions not supported.","severity":"breaking","affected_versions":">=4.0.0"},{"fix":"Move the plugin instance to the `resolve.plugins` array in your webpack config.","message":"The plugin must be placed in `resolve.plugins`, not in the root `plugins` array.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Set `extensions: ['.ts', '.tsx', '.js', '.jsx']` (or match your webpack resolve.extensions).","message":"If using `allowJs` in tsconfig.json, ensure `extensions` option includes `.js` and `.jsx`, otherwise resolution may fail.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Manually pass the same extensions as in your webpack `resolve.extensions` to the plugin.","message":"The plugin does not respect webpack's `resolve.extensions` automatically; you must set `extensions` option explicitly.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Ensure tsconfig-paths-webpack-plugin is added to resolve.plugins and tsconfig.json has correct paths.","cause":"Plugin not configured or paths not aligned with tsconfig.json.","error":"Module not found: Error: Can't resolve '@alias/some-module'"},{"fix":"Move plugin to `resolve: { plugins: [...] }` in webpack config.","cause":"Misplaced plugin in root 'plugins' instead of 'resolve.plugins'.","error":"Cannot read property 'apply' of undefined"},{"fix":"Downgrade plugin to v3 (npm install tsconfig-paths-webpack-plugin@3) or upgrade webpack to 5.","cause":"Using webpack 4 with version 4 of the plugin.","error":"TypeError: Cannot destructure property 'getPlugin' of '...' as it is undefined."},{"fix":"Ensure only one instance of TsconfigPathsPlugin is added and it's a valid resolver plugin.","cause":"Plugin instantiated incorrectly or multiple resolver plugins conflict.","error":"Error: The 'compilation' argument must be an instance of Compilation"},{"fix":"Create tsconfig.json or set absolute path for `configFile` option.","cause":"Missing tsconfig.json or incorrect configFile path.","error":"Warning: No configuration file (tsconfig.json) found."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}