exports in non-library entry files produces stray import identifiers

[Hazelfire]

🐛 bug report

I came across an issue where parcel build produces invalid code when parcel alone simply works.

Say I have the following files:

// index.mjs
export * from './module/core.mjs';
import * as core from './module/core.mjs';
export default core

// module/core.mjs
export default {}

<!-- index.html -->
<script src="./index.mjs" type="module" />

If I run parcel ./index.html, it displays a blank website without any errors. However, if I run parcel build ./index.html, the resulting built js file just looks like this:

$36f04a8a63fb858c$import$5ecbb526cd5c0bbc;
//# sourceMappingURL=index.29886bc3.js.map

Which obviously, when run inside a browser, gives an undefined reference error for this strangely named variable that was never declared.

🎛 Configuration (.babelrc, package.json, cli command)

I have a reproduction repo here: https://github.com/Hazelfire/parcel-module-repro.

🤔 Expected Behavior

I expected the above code to compile correctly, and not create arcanely named variables. Especially considering that yarn without the yarn build works fine.

😯 Current Behavior

yarn build produces invalid code as above

💁 Possible Solution

Not sure what's causing this.

🔦 Context

The package fast-json-patch has a piece of code that matches this pattern, and therefore doesn't compile under parcel build. This is a dependency of vega-embed, which I'm using in my project. All projects dependent on fast-json-patch cannot be built using parcel build

💻 Code Sample

https://github.com/Hazelfire/parcel-module-repro

🌍 Your Environment

Software	Version(s)
Parcel	2.3.2
Node	12.22.5
Yarn	1.22.7
Operating System	ChromeOS

[mmcgahan]

My guess is that this has something to do with tree shaking/optimization that is removing unused code - since index.mjs doesn't actually do anything other than export, it's possible that the optimizer is removing everything? If you replace the contents of core.mjs and index.mjs with something that actually executes code, does it work as expected?

[Hazelfire]

Yeah, it's likely something to do with tree shaking.

As for "something that actually executes code", could you give a specific example? Here's what I tried:

// index.mjs
export * from './module/core.mjs';
import * as core from './module/core.mjs';
console.log(core)
export default core

Results in

console.log($36f04a8a63fb858c$import$5ecbb526cd5c0bbc);$36f04a8a63fb858c$import$5ecbb526cd5c0bbc;
//# sourceMappingURL=index.7cbd2617.js.map

Which still exhibits the error

[Hazelfire]

The current head of v2 (c9264c4) exhibits this problem on a fresh build

[Hazelfire]

Interestingly, running parcel build --no-optimize ./index.html on the head of v2 returns:

var $771420b136e5cd5f$export$2e2bcd8739ae039 = {
};



var $85d5af804b8f24f8$export$2e2bcd8739ae039 = $85d5af804b8f24f8$import$5ecbb526cd5c0bbc;


//# sourceMappingURL=index.ee61046f.js.map

Which is different but still invalid

[Hazelfire]

Hey! Temporary but interesting fix. Running parcel build --no-scope-hoist ./index.html produces a valid result, with much more js.

[paradite]

I had the same problem when running code from https://github.com/tensorflow/tfjs-examples/tree/master/lstm-text-generation.

Can be resolved by using parcel build --no-scope-hoist

[caizixian]

@mischnic I had the same issue when trying out react-vega (which depends on vega-embed).

It's not clear from the above discussion whether it's a parcel bug (i.e., the importing behavior is static yet scope hoisting fails to understand that), or whether it's the library (fast-json-patch) having coding patterns that are not friendly to scope hoisting.

[kylekarpack]

I was able to build an application including vega-embed while still leveraging scope hoisting by aliasing fast-json-patch in my package.json. This forces Parcel to use a file for fast-json-patch that it can properly hoist, as opposed the the index.mjs file, which it appears that it cannot. Here's an example of a package.json that should work:

{
  "dependencies": {
    "vega-embed": ">= 6.24.0"
  }
  "devDependencies": {
    "parcel": "^2.10.3"
  },
  "alias": {
    "fast-json-patch": "fast-json-patch/index.js"
  }
}

Related issue: adobe/react-spectrum-charts#346