S
SolidJS11mo ago
Revxrsal

vite bundling unused components from external libraries (SSR)

o/ question, i'm using https://github.com/x64Bits/solid-icons for icons and while i really like it, it seems to be including icons that i'm not using in the final build. my website is SSR'd and deployed in vercel, and it's complaining that the render function is too big. is there anything i can do to make it exclude icons i am not using?
GitHub
GitHub - x64Bits/solid-icons: The simplest way to use icons in SolidJS
The simplest way to use icons in SolidJS. Contribute to x64Bits/solid-icons development by creating an account on GitHub.
No description
18 Replies
thetarnav
thetarnav11mo ago
it should tree-shake them they are exported as separate function from what I see https://www.npmjs.com/package/solid-icons?activeTab=code
npm
solid-icons
Modern solution for use icons on SolidJS. Latest version: 1.0.12, last published: 10 days ago. Start using solid-icons in your project by running npm i solid-icons. There are 17 other projects in the npm registry using solid-icons.
thetarnav
thetarnav11mo ago
there is something wrong why is the file index.mjs as if the default is cjs
Revxrsal
Revxrsal11mo ago
ehh what is it supposed to be? (meant to quote the second message) also is it not tree-shaking them? because for some reason the bundle size is 7 mb 🥴
thetarnav
thetarnav11mo ago
I'm not sure what is wrong either it's how you use them (I doubt that) or the way your vite project is setup
Revxrsal
Revxrsal11mo ago
my vite project uses the Vercel plugin here's the project: https://github.com/Revxrsal/portfolio
Revxrsal
Revxrsal11mo ago
this is what vercel uses
No description
thetarnav
thetarnav11mo ago
if you build locally without the adapter, does it work fine?
Revxrsal
Revxrsal11mo ago
yeah, the adapter is just needed for vercel deployment
thetarnav
thetarnav11mo ago
same bundle without adapter?
Revxrsal
Revxrsal11mo ago
yeah. apparently its just the vercel plugin that bundles the icons for the .vercel output dir
Revxrsal
Revxrsal11mo ago
npm
solid-start-vercel
Adapter for Solid apps that work on Vercel.. Latest version: 0.3.5, last published: 20 days ago. Start using solid-start-vercel in your project by running npm i solid-start-vercel. There are no other projects in the npm registry using solid-start-vercel.
Revxrsal
Revxrsal11mo ago
i tried removing the solid-icons dependency and copy-pasting the icons i needed, and that seemed to fix the bundle size error but it created another, very weird problem https://discord.com/channels/722131463138705510/1141806554870448188/1141806554870448188 an error would appear whenever i open the page, and disappear after a simple F5 refresh
Revxrsal
Revxrsal11mo ago
No description
vibeman1987
vibeman198711mo ago
i think this is just a fast refresh, no?
Revxrsal
Revxrsal11mo ago
i thought so, but it appears on my production website 🥴 when i navigate between a page that has no icons to a page that contains icons, it appears
x64Bits
x64Bits9mo ago
Hi @Revxrsal , My builds of start, astro, cloudflare and static are only building the icons imported into the project, is it possible that it is just an adapter problem? according to this last error you mention, it was solved since 1.1.0
Revxrsal
Revxrsal9mo ago
I don't know, I don't think the problem occurred with the static adapter. Yeah it's probably with the vercel adapter updated solid-icons, apparently they've fixed wit SSR. issue seems to be gone. i'm really happy
x64Bits
x64Bits9mo ago
Happy to hear that! 🙌🏼
Want results from more Discord servers?
Add your server
More Posts
How to mutate a createResource storageHi all, I'd like to get some help with mutating a store that is set as a createResource storage. ``Are there any important considerations to creating signals in control component callbacks like ForHi, wondering if there's anything to consider in terms of tracking etc in having something like thisDispose function not actually disposing of anythingI'm running Solid as a partial view inside another, non-Solid app. I've used webpack to export SolidReact key prop substitute!I know what you're thinking, James, you silly sausage - Solid.js doesn't require keys for loops, andBest way to dynamically access i18n-translations with typescriptHey folks, I am currently using @solid-primitives/i18n (https://github.com/solidjs-community/solid-i18n and context issuesHey folks, I am currently migrating to the 2.0.0 release of `@solid-primitives/i18n`. (https://gitDifference between `setState` and `produce`?I have `appState` as a store, and I'm trying to pass `appState.selectedTable` as a prop to a child cSolid Start not deploying on vercel in turborepoHi all, my solid start project doesn't deploy to vercel, aka every build fails. There are no error'Problem duplicating a component navigating with dynamic routingI am having difficulty causing a route component to be duplicated when navigating between a dynamic How to solve ts(2322) error on "each" attribute of "For" componentI'm trying to render items using the built-in "For" component for solid but I keep getting the follo