{"id":11944,"library":"resolve-typescript-plugin","title":"Webpack TypeScript Resolution Plugin","description":"resolve-typescript-plugin is a webpack plugin designed to bridge the gap between TypeScript's ES Module output expectations and webpack's module resolution for ES Modules. It allows developers to import TypeScript files using a `.js` extension (e.g., `import { foo } from './bar.js'`) which aligns with native ES Module resolution behavior in Node.js and browsers, rather than webpack's default of requiring `.ts` or no extension. The current stable version is 2.0.1. Its release cadence has been infrequent since the introduction of an equivalent built-in feature in webpack. A key differentiator was solving the specific import extension problem for ESM TypeScript projects before webpack v5.74.0; now, its primary use case is for projects still on older webpack versions that require this specific resolution behavior. It is effectively in maintenance mode for older webpack versions, as webpack itself now offers `resolve.extensionAlias` for this functionality, making the plugin largely obsolete for modern webpack setups.","status":"deprecated","version":"2.0.1","language":"javascript","source_language":"en","source_url":"https://github.com/softwareventures/resolve-typescript-plugin","tags":["javascript","ESM","TypeScript","plugin","resolve","webpack","typescript"],"install":[{"cmd":"npm install resolve-typescript-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add resolve-typescript-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add resolve-typescript-plugin","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Required as a peer dependency for webpack plugin functionality.","package":"webpack","optional":false}],"imports":[{"note":"For webpack.config.js files set to 'type': 'module' in package.json. If using CommonJS for webpack.config.js (e.g., webpack.config.cjs or older webpack 4 setups), use `require`.","wrong":"const ResolveTypeScriptPlugin = require('resolve-typescript-plugin');","symbol":"ResolveTypeScriptPlugin","correct":"import ResolveTypeScriptPlugin from 'resolve-typescript-plugin';"},{"note":"Options are passed to the constructor. The `includeNodeModules` option is notable for controlling resolution within `node_modules`.","symbol":"ResolveTypeScriptPlugin Options","correct":"new ResolveTypeScriptPlugin({ includeNodeModules: true });"}],"quickstart":{"code":"import ResolveTypeScriptPlugin from 'resolve-typescript-plugin';\n\n/** @type {import('webpack').Configuration} */\nexport default {\n    mode: 'development',\n    entry: './src/index.ts',\n    output: {\n        filename: 'bundle.js',\n        path: new URL('./dist', import.meta.url).pathname\n    },\n    module: {\n        rules: [\n            {\n                test: /\\.tsx?$/,\n                use: 'ts-loader',\n                exclude: /node_modules/\n            }\n        ]\n    },\n    resolve: {\n        // It's recommended to remove .ts and .tsx from resolve.extensions when using this plugin\n        extensions: ['.js', '.json'],\n        plugins: [new ResolveTypeScriptPlugin()]\n    },\n    // Recommended for ES Module projects\n    experiments: {\n        outputModule: true\n    }\n};","lang":"typescript","description":"Illustrates how to integrate the plugin into a webpack configuration for an ES Module TypeScript project, enabling `.js` extension imports for `.ts` files."},"warnings":[{"fix":"Migrate your webpack configuration to use `resolve.extensionAlias`: `{ '.js': ['.ts', '.js'], '.mjs': ['.mts', '.mjs'] }` and remove `new ResolveTypeScriptPlugin()` from `resolve.plugins`.","message":"This plugin is largely obsolete for webpack v5.74.0 and newer. Webpack now provides equivalent functionality via `resolve.extensionAlias`.","severity":"deprecated","affected_versions":">=1.0.0"},{"fix":"Upgrade your Node.js environment to version 14, 16, or 18+ to use versions 2.x of this plugin.","message":"Node.js versions 12 and 17 are no longer supported since v2.0.0.","severity":"breaking","affected_versions":">=2.0.0"},{"fix":"Ensure `resolve.fullySpecified` is not explicitly set to `true` in your webpack configuration when using this plugin, or remove it if present.","message":"Previous versions of the README recommended setting `resolve.fullySpecified` to `true`. This is no longer recommended as it can break compatibility with `webpack-dev-server` and other tooling.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"For webpack 4.x, name your configuration file `webpack.config.cjs` and use CommonJS `require()` syntax for imports/exports.","message":"When using webpack 4.x with ES modules, your `webpack.config.js` file cannot be in ES module format if `\"type\": \"module\"` is set in `package.json`.","severity":"gotcha","affected_versions":">=1.0.0 <2.0.0"},{"fix":"If needed, enable resolution within `node_modules` by configuring the plugin with `new ResolveTypeScriptPlugin({ includeNodeModules: true })`.","message":"The plugin by default does not resolve TypeScript files within `node_modules`. This can be unexpected if you have TS-only dependencies that require this resolution behavior.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Ensure `new ResolveTypeScriptPlugin()` is correctly added to `resolve.plugins` in your webpack config. Also, remove `.ts` and `.tsx` from your `resolve.extensions` array to avoid conflicts. For webpack >= 5.74.0, use `resolve.extensionAlias` instead of the plugin.","cause":"Attempting to import a TypeScript file using a `.js` extension without the plugin or `extensionAlias` configured correctly, or `resolve.extensions` still contains `.ts`/`.tsx`.","error":"Module not found: Error: Can't resolve './some-module.js' in '...' (webpack)"},{"fix":"Ensure your webpack config aligns with the project's module type. If `\"type\": \"module\"` is in `package.json`, use `import` for the plugin and ensure the webpack config itself is an ESM module (e.g., `export default { ... }`). For CommonJS configs, use `const ResolveTypeScriptPlugin = require('resolve-typescript-plugin');`.","cause":"This error can occur in older versions of the plugin or webpack if the `webpack.config.js` is set to CommonJS and the plugin is imported incorrectly, or there's a misconfiguration of webpack's ESM handling.","error":"ERROR in   Error: webpack.WebpackError: TypeError: The 'this' context cannot be converted to an object. (webpack)"}],"ecosystem":"npm"}