Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Uncaught ReferenceError: e is not defined error when bundling auth0-js package #8277

Closed
louh opened this issue Jul 3, 2022 · 0 comments · Fixed by #8276
Closed

Uncaught ReferenceError: e is not defined error when bundling auth0-js package #8277

louh opened this issue Jul 3, 2022 · 0 comments · Fixed by #8276

Comments

@louh
Copy link

louh commented Jul 3, 2022

🐛 bug report

When importing from the auth0-js package, the following error appears in console:

Uncaught ReferenceError: e is not defined
    ["1PhJE"]< idtoken-verifier.esm.js:1
    newRequire index.0641b553.js:71
    localRequire index.0641b553.js:84
    bNKaB app.js:1
    newRequire index.0641b553.js:71
    <anonymous> index.0641b553.js:122
    <anonymous> index.0641b553.js:145

In my real-world use case, which uses Parcel's programmatic API to bundle the application inside of an Express app, the error also overlays the app like so:

Screen Shot 2022-07-03 at 10 22 39 AM

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

I can recreate the error using a very minimal Parcel app. See link to minimal repro below.

🤔 Expected Behavior

Import should not mangle variables.

😯 Current Behavior

The source file, idtoken-verifier.esm.js (located in the idtoken-verifier dependency of auth0-js) has this following snippet (reformatted for readability):

function e (t) {
  const e = { exports: {} }
  return t(e, e.exports), e.exports
}
const r = e(function (e, r) {
  [... rest of function snipped ...]
})

Note where const r runs e(), which is defined just above r.

In the Parcel bundle, the same snippet is now:

function e8(t1) {
    var e7 = {
        exports: {}
    };
    return t1(e7, e7.exports), e7.exports;
}
var r = e(function(e9, r1) {
  [... rest of function snipped ...]
})

The line at var r calls e, which is not defined (raising the error), and it is not defined because the previous function has been renamed e8. Something is causing the original function to be renamed, but the calling function is not updated to refer to the renamed function.

💁 Possible Solution

Unknown.

🔦 Context

We're upgrading our application from Parcel v1 to Parcel v2. Our application worked fine in Parcel v1, but we also don't want to lock ourselves into an older and unmaintained version. As the JavaScript ecosystem evolves we are also updating our infrastructure. However, this issue blocks our ability to upgrade.

The Auth0-js package is part of our application to connect to Auth0, a user account login provider. It's a necessary part of our application. Without a workaround for building this package, we cannot update to Parcel v2.

💻 Code Sample

I have created a minimal reproduction of this issue using vanilla Parcel and no other frameworks. Please see this repository: https://github.com/streetmix/parcel-auth0-error

git clone https://github.com/streetmix/parcel-auth0-error.git
cd parcel-auth0-error
npm install
npx parcel src/index.html    

This creates a minimal page whose JavaScript bundle only imports a method from auth0-js. The error exists regardless of whether it's a minimal use case or a large application.

🌍 Your Environment

Software Version(s)
Parcel 2.6.2
Node 18.4.0
npm 8.12.1
Operating System MacOSX 12.4

Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants