<enhanced:img> in masonry layout
I am using <enhanced:img> and Svelte Bricks to create a masonry layout. The setup worked great with a standard
<img>
tag but had an atrocious Lighthouse score!
Hence, I have switched to <enhanced:img>
. Upon doing this, I switched my images from ./static/
to ./lib/
and also used Vite's import.meta.glob
to correctly import the images. Once I did all this, with the code as below, I now get the RangeError: Invalid array length
error when loading the images and I am unsure where it is coming from. The stack trace seems to suggest it is svelte-bricks
so if that is the issue then I would be happy to switch to another lib.
Here is a SvelteLab project But this is displaying different behaviours I think it is something to do with how SvelteLab works, but the same project gives the RangeError: Invalid array length
error locally so make sure to run it locally!7 Replies
The RangeError: Invalid array length error typically occurs in JavaScript when an attempt is made to create an array with an invalid length, such as a negative number, or a number that is not an integer.
In the context of Svelte, this error might arise if the array you're trying to iterate over is not properly defined or has an unexpected length.
@Dracon did you use ChatGPT or another LLM to generate that answer?
it's true that I consulted GPT. But I don't answer if I am not sure of it.
it really reads like a ChatGPT answer, hence the question. Please don't use ChatGPT to answer questions in the future
I appreciate that you want to help, but people can check it themselves if they want an AI generated answer
I know how svelte and its ecosystem work. And all I wanted to do was just validify my answer using AI.
If you don't know how Svelte works and you want to help, Zax71 provided a playground you can click around in and try your answer out. Otherwise, I've said my piece, and it's mentioned explicitly in the rules
all right