{"id":22607,"library":"vite-plugin-cjs-interop","title":"vite-plugin-cjs-interop","description":"A Vite plugin that unwraps default imports from CommonJS (CJS) dependencies during SSR, solving the issue where CJS modules with both default and named exports require accessing the default via .default in ESM. Version 3.3.0 is current, with recent releases every few months. It works around Vite's SSR hoisting bug (vite#22122) and supports Vite 6.4–8. Automatically transforms import statements so that default imports work seamlessly in SSR, and handles dynamic imports to allow both ESM namespace and CJS direct property access. Competes with vite-plugin-commonjs but focuses specifically on default interop during SSR. ESM-only since v3 headless.","status":"active","version":"3.3.0","language":"javascript","source_language":"en","source_url":"https://github.com/cyco130/vite-plugin-cjs-interop","tags":["javascript","cjs","interop","ssr","vite-plugin"],"install":[{"cmd":"npm install vite-plugin-cjs-interop","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-cjs-interop","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-cjs-interop","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency, only works with Vite.","package":"vite","optional":false}],"imports":[{"note":"Package is ESM-only since v3 (no CommonJS release). require() will fail unless using a bundler that can handle ESM.","wrong":"const cjsInterop = require('vite-plugin-cjs-interop')","symbol":"cjsInterop","correct":"import { cjsInterop } from 'vite-plugin-cjs-interop'"},{"note":"The package exports a named export `cjsInterop`, not a default export. Using default import will result in undefined.","wrong":"import cjsInterop from 'vite-plugin-cjs-interop'","symbol":"default (cjsInterop)","correct":"import { cjsInterop } from 'vite-plugin-cjs-interop'"},{"note":"Options type is exported but only available as a type import. Using a value import will cause a runtime error.","wrong":"import { CjsInteropOptions } from 'vite-plugin-cjs-interop'","symbol":"Type (CjsInteropOptions)","correct":"import type { CjsInteropOptions } from 'vite-plugin-cjs-interop'"}],"quickstart":{"code":"import { defineConfig } from 'vite';\nimport { cjsInterop } from 'vite-plugin-cjs-interop';\n\nexport default defineConfig({\n  plugins: [\n    cjsInterop({\n      dependencies: [\n        'some-cjs-package',\n        'another-package/deep',\n        '@scope/**',\n      ],\n    }),\n  ],\n});","lang":"typescript","description":"Shows how to import, configure, and add the plugin to a Vite config, listing CJS dependencies that need interop."},"warnings":[{"fix":"Use ESM imports (import) instead of require(). If you must use CommonJS, stay on v2.x.","message":"v3.0.0 dropped CommonJS release; package is now ESM-only.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Upgrade Vite to a supported version (6.4+, 7.3+, or 8).","message":"v3.0.0 dropped support for older Vite versions (requires ~6.4 || ~7.3 || 8).","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Ensure deep imports like 'pkg/subpath' are listed separately, or use a glob pattern like 'pkg/**'.","message":"dependencies option requires explicit listing of deep imports; globs are supported but must be correctly configured.","severity":"gotcha","affected_versions":"*"},{"fix":"Make sure every CJS dependency that needs default interop is included in the dependencies array.","message":"The plugin does not transform CJS dependencies that are not listed in the 'dependencies' option.","severity":"gotcha","affected_versions":"*"},{"fix":"","message":"No known deprecations yet.","severity":"deprecated","affected_versions":"none"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Add the package name to the cjsInterop({ dependencies: ['your-package'] }) configuration.","cause":"CJS dependency's default export is not being unwrapped because the package is not listed in the interop dependencies.","error":"TypeError: Cannot read properties of undefined (reading 'default')"},{"fix":"Use ESM imports (import { cjsInterop } from 'vite-plugin-cjs-interop') or downgrade to v2.x.","cause":"Using require() to load the plugin, but it's ESM-only since v3.","error":"ERR_REQUIRE_ESM: require() of ES Module /node_modules/vite-plugin-cjs-interop/dist/index.js from ... not supported."},{"fix":"Ensure the package is correctly listed in cjsInterop dependencies, and avoid manually accessing .default on the import.","cause":"A CJS dependency's default export is being accessed as .default.default due to double wrapping.","error":"Uncaught TypeError: default_1.default is not a function"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}