NextJS 14+ build error: Attempted import error: 'WavHeader' is not exported from '../lame.all.js'

Sendbird Chat UIKit
1

[Problem/Question]
I added the UIKit to a vanilla NextJS app, following the instructions at Build a Next.js app for chat messaging: Adding Sendbird UIKit to a Next.js app | Sendbird.

When I tried to build, I saw an error:

Attempted import error: 'WavHeader' is not exported from '../lame.all.js' (imported as '$dd7ee3788d91dcb8$export$cb948f2d6837f136').
Import trace for requested module:
../../node_modules/@sendbird/uikit-react/chunks/bundle-KkDaqYo6.js
../../node_modules/@sendbird/uikit-react/VoiceRecorder/context.js
../../node_modules/@sendbird/uikit-react/App.js
./app/components/Chat.tsx
./app/page.tsx

I’m able to workaround this by using NextJS 13.5.1

// If problem, please fill out the below. If question, please delete.
[UIKit Version]
3.8.2

[Reproduction Steps]
Follow instructions at Build a Next.js app for chat messaging: Adding Sendbird UIKit to a Next.js app | Sendbird with a vanilla NextJS 14.0.3 (latest) build.

[Frequency]
Every time

[Current impact]
High impact. Workaround was to revert NextJS to 13.5.1 and then everything built as expected

3

Hello @seatedviper

I have checked the issue you mentioned. It seems to be a problem with the nextjs.

Could you please try upgrading to version 14.0.1?

After changing the version, delete the .next and .node_modules folders before running it.

4

Thanks. @Luke_Cha. I realize I wasn’t clear that my original bug was with NextJS 14.0.3

nextjs 14.0.1 This works fine and I can’t repro the issue
nextjs 14.0.2 Can reproduce
nextjs 14.0.3 (latest) Can reproduce.

5

Great!

Have a nice day!

6

Wait but isn’t this a problem still if it’s broken in the latest nextjs release?

7

I think the problem has been solved in version 14.0.4.

image
image1568×1130 182 KB

8

Confirmed! Thanks @Luke_Cha

1 Like