next.js: Attempted import error: 'hls.js' does not contain a default export

Link to the code that reproduces this issue

https://github.com/laugharn/next-mux-repro

To Reproduce

  1. Start the application in development (pnpm run dev)
  2. Go to http://localhost:3000
  3. See the import in in app/page.jsx causes the compile error

Current vs. Expected behavior

The export from hls.js should be detected correctly. I’m using the @muxinc library for demo purposes because that’s how this emerged in our project, but importing hls.js directly has the same effect.

Verify canary release

  • I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 22.6.0: Fri Sep 15 13:41:28 PDT 2023; root:xnu-8796.141.3.700.8~1/RELEASE_ARM64_T6020
Binaries:
  Node: 18.18.2
  npm: 9.8.1
  Yarn: N/A
  pnpm: 8.10.0
Relevant Packages:
  next: 14.0.2-canary.9
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0
  typescript: N/A
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

App Router

Additional context

This looks like it was introduced in 14.0.2-canary.1 and my assumption is #57784 specifically.

About this issue

  • Original URL
  • State: closed
  • Created 8 months ago
  • Reactions: 12
  • Comments: 28 (3 by maintainers)

Most upvoted comments

OK… I had this same problem. I systematically backed down mux player version by version… the last stable release of mux player that does not have this error is 1.11.3 (1.11.4 is where the break starts). This is true of all version of nextjs (13 and 14 work fine with 1.11.3 or earlier). For now, I backed down to 1.11.3 until this gets fixed.

stepped down to version 14.0.1 and the error is gone, mux player works fine now.

@EliHood The issue is Next.js, and the version to blame is 14.0.2; this problem will prevent many people from keeping up with current versions and bugfixes - this issue has been open for weeks, it’s been reproduced, it’s affecting multiple libraries, and it would be really great if this could be given some level of priority

So is it agreed that this is a mux video issue, not a next js issue ? or were not sure yet ?

It’s not a mux problem, I use another player rather than mux and it has the same error. Version 14.0.1 does not have this error

It is compatible with Next 14 up to 14.0.2-canary.0 and then the bundling behavior changes. It stands to reason that other packages besides hls.js (the actual problem dependency) are breaking. If the end result is these packages should change their build process fair enough but the outcome here is the result of a change in Next.

@muhaimincs should be fixed in next@v14.0.4-canary.33

Same problem with @arcgis/core library. Works fine in v14.0.1, but not since v14.0.2. Same error regarding missing a default export, but the default export is there.

Thanks for all of these findings guys, will try to investigate / debug this issue further.

@jamesvclements upgrading to next@v14.0.4 solved the issue. Thanks

Also seeing this with @arcgis/core. Presents as:

./node_modules/@arcgis/core/widgets/support/widgetUtils.js
Attempted import error: '@esri/arcgis-html-sanitizer' does not contain a default export 

Boy did this ruin my afternoon! Downgrading to 14.0.1 has fixed it.