Possible to have `export default` emit as `module.exports`

[alii]

I know it's not the preferred way of having a default export, but it would save a lot of time if this would be possible. I'm writing an ESLint plugin and currently cannot import the plugin into a CJS file because the module is exported as module.exports.default rather than simply module.exports.

Have only come across this issue which I wasn't able to find a way to implement it properly: https://github.com/egoist/tsup/issues/283 and also #255 but I got the warnings below:

Thanks!

Upvote & Fund

• We're using Polar.sh so you can upvote and help fund this issue.
• We receive the funding once the issue is completed & confirmed by you.
• Thank you in advance for helping prioritize & fund our backlog.

[paambaati]

+1. It isn't obvious what the fix is when trying to write modules with export default ... with CJS output.

[egoist]

You can re-export it in another file:

module.exports = require('./dist/index').default

And use this file in the main field in package.json instead

[paambaati]

FWIW, I solved this by adding this to my tsup config –

import { defineConfig } from 'tsup'

export default defineConfig({
  splitting: false,
  sourcemap: false,
  minify: true,
  clean: true,
+  esbuildOptions: (options) => {
+   options.footer = {
+    // This will ensure we can continue writing this plugin
+      // as a modern ECMA module, while still publishing this as a CommonJS
+      // library with a default export, as that's how ESLint expects plugins to look.
+      // @see https://github.com/evanw/esbuild/issues/1182#issuecomment-1011414271
+      js: 'module.exports = module.exports.default;',
+    }
  },
  entry: ['src/index.ts'],
})

See https://github.com/getoslash/eslint-plugin-tap/pull/36 for reference.

[lvjiaxuan]

You can re-export it in another file:

module.exports = require('./dist/index').default

And use this file in the main field in package.json instead

We can manually do that in our personal file, but maybe in some runtime env like ESlint couldn't do that.

[lvjiaxuan]

I know it's not the preferred way of having a default export, but it would save a lot of time if this would be possible. I'm writing an ESLint plugin and currently cannot import the plugin into a CJS file because the module is exported as module.exports.default rather than simply module.exports.

Have only come across this issue which I wasn't able to find a way to implement it properly: #283 and also #255 but I got the warnings below:

Thanks!

I am wondering why it's not the preferred way of having a default export. Could you explain any arguments for me, thanks~~

[u3u]

Everyone, I created a library of fix-tsup-cjs to solve this problem. It can also fix d.ts (export =) Just modify your build script to tsup && npx fix-tsup-cjs 🎉

Related issues: #255 #283 #338 #572 #710 /cc @pushkine @privatenumber @tbnritzdoge @yaquawa

[github-actions[bot]]

:tada: This issue has been resolved in version 7.2.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket:

[psirenny]

Should this issue be closed? I find that I still need the module.exports = module.exports.default workaround. The --cjsInterop flag doesn't set module exports to the default value even in modules with just a default export.

[sxzz]

Could you please provide a minimum reproduction repo?

[psirenny]

Here's a GitHub repo that reproduces the issue: https://github.com/psirenny/tsup-cjs-default-export

The source directory has a module exporting a default string. There's a test.cjs file that imports from the built module. It expects to import a string but instead imports a { default: [Getter] }.

[sxzz]

@psirenny Because of issue https://github.com/evanw/esbuild/issues/3281, we have to also enable --splitting flag as a workaround.

[psirenny]

we have to also enable --splitting flag as a workaround.

Aha, that does indeed do the trick. Thanks for explaining that!

[Mintnoii]

@sxzz --splitting does work indeed, but I'm not quite sure why enabling code splitting resolves this issue. Additionally, the documentation section on --cjsinterop doesn't explicitly mention the need to use --splitting concurrently. Could you briefly explain its underlying mechanism? Thank you very much!

[sxzz]

See https://github.com/evanw/esbuild/issues/3281. In CJS mode, esbuild didn't generate valid export metadata. I think it's a bug of esbuild. So it blocked using cjsinterop in CJS. But with --splitting flag, tsup will treat CJS as ESM at first then convert ESM back into CJS. So this tricky way can solve the problem.

For docs, maybe someone can submit a PR for mentioned that.