Next.js Discord

Discord Forum

Dynamic Library goes in the _app chunk

Unanswered
Bruno Jura Hound posted this in #help-forum
Open in Discord
Bruno Jura HoundOP
Hiya guys! I wanted to dynamically load a library (not a component) via import('lib').then(usage) to reduce _app chunk size, but for some reason nextjs doesn't create separate chunk for my library. I bootstrapped brand new nextjs project and installed the same library and it went to separate chunk which led me to the thought that there is some problem with configuration of my project. We dont do much in our next.config.js (sorry cannot share it cuz its private) I just wanted some advices or trics how I can debug chunk splitting process (next build --debug didn't give me any results).

I tried to play with webpackModes and tried to increase minSize of chunk in webpack config nothing worked.

Btw I tried to install random npm library, and next created separate chunk for it even though I didn't lazy load it.

So probably my question is How does NextJS decide which library should be in separate chunk and which dont and can I manually ask NextJS to create separate chunk.

3 Replies

Bruno Jura HoundOP
Any chances I could get help? :meow_coffee:
Boston Terrier
Following!

For component, next/dynamic can be used, for lib/packages I always assumed it did create a smaller chunk on dynamic imports but seems like not.

https://nextjs.org/docs/app/building-your-application/optimizing/lazy-loading#loading-external-libraries
Bruno Jura HoundOP
🤠