Can you use this for local images?

[TomSmedley]

Hey this looks like a great solution for Svelte that doesn't have a native image optimisation option. Most of my projects that are CMS based score on the lighthouse poorly because of image optimisation and lack of WebP. This wasn't an issue with NextJS as it would optimise the images.

What I am finding however, is local images are not working, I noticed on the React extention you can import a local file, but with Svelte it gives the error:

TypeError [ERR_INVALID_URL]: Invalid URL
    at new NodeError (node:internal/errors:399:5)
    at URL.onParseError (node:internal/url:565:9)
    at new URL (node:internal/url:645:5)
    at getImageCdnForUrl (file:///C:/Users/toms/Documents/Projects/GitHub/eda/node_modules/unpic/esm/src/detect.js:7:36)
    at getTransformerForUrl (file:///C:/Users/toms/Documents/Projects/GitHub/eda/node_modules/unpic/esm/src/transform.js:31:67)
    at Proxy.transformProps (file:///C:/Users/toms/Documents/Projects/GitHub/eda/node_modules/@unpic/core/dist/core.mjs:151:53)
    at image.svelte:6:51
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1974:22)
    at Intro.svelte:50:28
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1974:22)

Does it automatically transform all img tags with Svelte? As some are still using <img src="/image.png"> rather than import.

[ahnpnl]

I ran into this error as well. I think the components assume image url always a cdn one, which might lead to that error.

Would be nice if this error can be handled and just simply fallback to render the original url instead.

[ascorbic]

Yeah, that could be a good idea, though you would lose the ability to generate a srcset or crop the image. The reason I didn't is because the could be confusing - users might expect it to still work properly, when actually it's not. The way I work around it on my own sites is to conditionally render an <img> or <Image> depending on whether the URL starts with https:

[ahnpnl]

ya that workaround would work for me. But what if a production URL which starts with https but not a CDN url?

[ahnpnl]

ah, actually it works even with https URL which is not CDN. Thank you for your response.

[ascorbic]

Yeah, those ones it will pass through. In fact, as we're already doing that for non-CDN absolute URLs, we should probably just do the same for relative URLs.

[ahnpnl]

Hi, is it better if we include this feature in? At the moment I'm doing like your suggestion

Yeah, that could be a good idea, though you would lose the ability to generate a srcset or crop the image. The reason I didn't is because the could be confusing - users might expect it to still work properly, when actually it's not. The way I work around it on my own sites is to conditionally render an or depending on whether the URL starts with https: