Default import vs member style import
I have a next js project which is in a polyrepo, it consumes a lot of member style import on next dev it compiles over 34 000 modules and makes it almost impossible to deal with. Should I convert member style import to default import or is there a way to figure out who or why it is compiling 34 000 modules it has almost nothing as dependancy (mui, firebase)
3 Replies
When you say "member style import" do you mean this?
I don't see why a default import would decrease the number of modules. Do you mean put them in separate files ?
I just spent my whole day on this and it seems webpack as issue three shaking with member styled import (yes just like your example) , there is a full articles on this on webpack : https://webpack.js.org/guides/tree-shaking/ , i don’t know why it is causing this issue tho it seems like it can’t tell if some member style import have side effects so it imports the whole lib i just rewrote 12 import of icon from mui to default import and it loaded 23000 modules instead of 34000 nothing else changed. So yeah could it be because of externalDir experimental feature idk … seems like a lot of people have those issue on next github too
webpack
Tree Shaking | webpack
Mayne i’ll try adding modularize import to next : https://nextjs.org/docs/advanced-features/compiler#modularize-imports
Advanced Features: Next.js Compiler | Next.js
Learn about the Next.js Compiler, written in Rust, which transforms and minifies your Next.js application.