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

Repeated warnings when running in a Next.js app #200

Open
claquesous opened this issue May 31, 2024 · 2 comments
Open

Repeated warnings when running in a Next.js app #200

claquesous opened this issue May 31, 2024 · 2 comments
Labels

Comments

@claquesous
Copy link

I'm getting constant warnings when using IcecastMetadataPlayer in a Next.js app.

I'm including it in a component called player.tsx this way: import IcecastMetadataPlayer from 'icecast-metadata-player'

When I tried a production build, I get this output during the build step which match the warnings when running in dev mode.

   Creating an optimized production build ...
 ⚠ Compiled with warnings

./node_modules/@eshaz/web-worker/cjs/node.js
Critical dependency: the request of a dependency is an expression

Import trace for requested module:
./node_modules/@eshaz/web-worker/cjs/node.js
./node_modules/@wasm-audio-decoders/common/src/WASMAudioDecoderWorker.js
./node_modules/@wasm-audio-decoders/common/index.js
./node_modules/@wasm-audio-decoders/flac/index.js
./node_modules/icecast-metadata-player/src/players/WebAudioPlayer.js
./node_modules/icecast-metadata-player/src/PlayerFactory.js
./node_modules/icecast-metadata-player/src/IcecastMetadataPlayer.js
./app/_components/player.tsx

./node_modules/synaudio/node_modules/@eshaz/web-worker/cjs/node.js
Critical dependency: the request of a dependency is an expression

Import trace for requested module:
./node_modules/synaudio/node_modules/@eshaz/web-worker/cjs/node.js
./node_modules/synaudio/src/SynAudio.js
./node_modules/synaudio/index.js
./node_modules/icecast-metadata-player/src/FrameQueue.js
./node_modules/icecast-metadata-player/src/players/Player.js
./node_modules/icecast-metadata-player/src/PlayerFactory.js
./node_modules/icecast-metadata-player/src/IcecastMetadataPlayer.js
./app/_components/player.tsx

 ✓ Compiled successfully

Originally, the Generating static pages step failed too, but I used this workaround to get the overall build to succeed:
https://nextjs.org/docs/pages/building-your-application/optimizing/lazy-loading#with-no-ssr

I don't really know much about Web Assembly, but I'm guessing the dynamic workaround could be because it just won't work server side. So be it. I'm wondering if the warning is legitimate though.

Thanks for your consideration.

@eshaz eshaz added the nextjs label Jun 1, 2024
@eshaz
Copy link
Owner

eshaz commented Jun 1, 2024

Based on the errors, it looks like the problem is in the eshaz/webworker library where Next.js is attempting to use the Node Web Worker polyfill.

The Web Worker code is used by the wasm-audio-decoders library for iOS compatibility, so if there is a problem there, iOS playback may not work as expected.

Could you try replacing your existing import IcecastMetadataPlayer from 'icecast-metadata-player' with what @DCRepublic did here #197 (comment). This should force the import and everything downstream that it uses to be evaluated client side. If it works, I think the warning should also go away.

@claquesous
Copy link
Author

So I can report back that the fix basically has the same effect as the dynamic option. Both allow me to do a production build, but neither are killing the stream of warnings. Unfortunately, this option is causing me TypeScript troubles, so I'll probably stick with the dynamic option which also feels a little more readable.

On a side note, I don't understand why 'use client' isn't the fix. It seems the most straightforward and even idiomatic for this scenario.

Apologies I didn't check closed issues for this. It's clearly happened a few times. I'd be happy to submit a PR to put a pointer in the README.

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

No branches or pull requests

2 participants