{"id":20763,"library":"webpack-fix-default-import-plugin","title":"Webpack Fix Default Import Plugin","description":"Webpack plugin that hooks into require() to polyfill module.exports.default for non-ES6 modules, enabling default imports (e.g., import React from 'react') when using TypeScript compiled to ES5. Current version 1.0.3 (last release), stable with no recent updates. Differentiators: avoids the need for a two-pass TypeScript→ES6→Babel pipeline, preserving source maps and reducing build time. Compatible with CommonJS output from TypeScript. Lightweight and specific to webpack + TypeScript workflows.","status":"active","version":"1.0.3","language":"javascript","source_language":"en","source_url":"https://github.com/sormy/webpack-fix-default-import-plugin","tags":["javascript","webpack","plugin","typescript","default","module","export","import"],"install":[{"cmd":"npm install webpack-fix-default-import-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add webpack-fix-default-import-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add webpack-fix-default-import-plugin","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"Package is CommonJS-only; ES import will break. Use require() in webpack config.","wrong":"import FixDefaultImportPlugin from 'webpack-fix-default-import-plugin';","symbol":"FixDefaultImportPlugin","correct":"const FixDefaultImportPlugin = require('webpack-fix-default-import-plugin');"},{"note":"Must instantiate with new. Common mistake: passing the class directly.","wrong":"plugins: [FixDefaultImportPlugin]","symbol":"FixDefaultImportPlugin","correct":"plugins: [new FixDefaultImportPlugin()]"},{"note":"Constructor takes no arguments. Options object not supported.","wrong":"new FixDefaultImportPlugin({})","symbol":"FixDefaultImportPlugin","correct":"new FixDefaultImportPlugin()"}],"quickstart":{"code":"// webpack.config.js\nvar FixDefaultImportPlugin = require('webpack-fix-default-import-plugin');\n\nmodule.exports = {\n  entry: './src/index.ts',\n  output: { filename: 'bundle.js' },\n  module: {\n    rules: [\n      {\n        test: /\\.tsx?$/,\n        use: 'ts-loader',\n        exclude: /node_modules/\n      }\n    ]\n  },\n  resolve: {\n    extensions: ['.tsx', '.ts', '.js']\n  },\n  plugins: [\n    new FixDefaultImportPlugin()\n  ]\n};","lang":"javascript","description":"Basic webpack configuration to enable default imports from CommonJS modules using TypeScript compiled to ES5."},"warnings":[{"fix":"Ensure tsconfig.json has: \"target\": \"es5\", \"module\": \"commonjs\", \"allowSyntheticDefaultImports\": true.","message":"The plugin only works when TypeScript targets ES5 with CommonJS module output. It does not support ES modules or other targets.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Test modules individually; consider using allowSyntheticDefaultImports and esModuleInterop in TypeScript instead.","message":"The plugin does not handle all edge cases (e.g., modules that intentionally have no default export). It may incorrectly assign a value to module.exports.default.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Set \"esModuleInterop\": true in tsconfig.json and remove this plugin.","message":"TypeScript 2.7+ includes esModuleInterop which solves this issue natively; consider upgrading instead of using this plugin.","severity":"deprecated","affected_versions":">=0.0.0"},{"fix":"Upgrade to >=1.0.3.","message":"Plugin version 1.0.3 fixes compatibility with axios v2; older versions may break with axios imports.","severity":"gotcha","affected_versions":"<1.0.3"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Run: npm install --save-dev webpack-fix-default-import-plugin and require it using correct path.","cause":"Plugin not installed or referenced correctly in webpack config.","error":"Module not found: Error: Can't resolve 'webpack-fix-default-import-plugin'"},{"fix":"Use: const FixDefaultImportPlugin = require('webpack-fix-default-import-plugin');","cause":"Importing the plugin incorrectly (e.g., using ES import syntax on a CommonJS module).","error":"TypeError: FixDefaultImportPlugin is not a constructor"},{"fix":"Set \"allowSyntheticDefaultImports\": true and \"module\": \"commonjs\" in tsconfig.json.","cause":"TypeScript configuration missing allowSyntheticDefaultImports or not compiling to CommonJS.","error":"Default import still not working after adding plugin"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}