CJS->ESM interop issues

[devongovett]

🐛 bug report

While working on #4366 I found a few CJS->ESM interop issues with the existing scope hoisting transformer and namespace imports. For now, I've followed them in the non-scope hoisting modules transformer, but we should do a full sweep and compare our output with Babel and Node.

1. Non-object exports

import * as n from './class';

// class.js
module.exports = class {}

• babel: {default: class {}}
• node: {default: class {}}
• parcel: class {}

2. Object exports

import * as n from './object.js';

// object.js
module.exports = {
  foo: 2,
  default: 3
};

• babel: {foo: 2, default: {foo: 2, default: 3}}
• node: {default: {foo: 2, default: 3}}
• parcel: {foo: 2, default: 3}

There are probably more cases too. See https://sokra.github.io/interop-test/.

[mischnic]

I just ran into a case where

import Thing from "...";
Thing.default

worked in Node but in Parcel it was

import Thing from "...";
Thing

(importing a CJS file that sets __esModule to true and does exports.default = plugin;)

---

Related issue: evanw/esbuild#532

[mischnic]

Another case is dynamic imports:

import("./b.js").then(console.log);

// b.js
module.exports = function f() {};

Node: [Module] { default: [Function: f] }

[mischnic]

https://github.com/evanw/esbuild/releases/tag/v0.14.4
https://github.com/evanw/bundler-esm-cjs-tests