sveltejs / kit

web development, streamlined
https://svelte.dev/docs/kit
MIT License
18.76k stars 1.95k forks source link

enhanced image: does not work, and fails when vite server origin is configured #13048

Open UltraCakeBakery opened 15 hours ago

UltraCakeBakery commented 15 hours ago

Describe the bug

when I configure vite locally as I did in the stackblitz reproduction, I get the following error:

11:09:18 PM [vite] Error when evaluating SSR module /src/routes/(public)/+page.svelte:
Error while preprocessing /workspaces/test/src/lib/client/components/Article.svelte - Failed parsing string to object: {sources:{avif:"http://crispy-enigma-9766jxxrgv9cp4g5.github.dev/@imagetools/2ac042bb202f73feca839531fb859688259f4f48 592w, http://crispy-enigma-9766jxxrgv9cp4g5.github.dev/@imagetools/14c4f9b364da02812278fe5d9f709af0f4e4b7be 1184w",webp:"http://crispy-enigma-9766jxxrgv9cp4g5.github.dev/@imagetools/e8a54b4d54c1776abfba0f5fa44502bd1eaee197 592w, http://crispy-enigma-9766jxxrgv9cp4g5.github.dev/@imagetools/9c5f751f9ee17884bbf4f0fc7a004b03c2340593 1184w",png:"http://crispy-enigma-9766jxxrgv9cp4g5.github.dev/@imagetools/55dded0d1210d835e7da60786c4791bbf00ea91f 592w, http://crispy-enigma-9766jxxrgv9cp4g5.github.dev/@imagetools/81e6df6384588527fdb816b61720532ce1b6e8cb 1184w"},img:{src:"http://crispy-enigma-9766jxxrgv9cp4g5.github.dev/@imagetools/81e6df6384588527fdb816b61720532ce1b6e8cb",w:1184,h:1008}}
    at parseObject (file:///workspaces/test/node_modules/.pnpm/@sveltejs+enhanced-img@0.4.1_rollup@4.24.0_svelte@5.2.7_vite@5.4.11_@types+node@22.9.1_/node_modules/@sveltejs/enhanced-img/src/preprocessor.js:236:9)

In the reproduction, enhanced:img elements do not get transformed at all. I followed the steps to set enhanced image up as described here: https://svelte.dev/docs/kit/images, but maybe I messed up. I now believe that maybe the latest version of enhanced:img is incompatible with the version of svelte the reproduction has (or my local environment?) I am not sure honestly.

Reproduction

https://stackblitz.com/edit/sveltejs-kit-template-default-zvdgag?file=src%2Froutes%2F%2Bpage.svelte

Logs

No response

System Info

System:
    OS: Linux 6.5 Ubuntu 22.04.5 LTS 22.04.5 LTS (Jammy Jellyfish)
    CPU: (2) x64 Intel(R) Xeon(R) Platinum 8370C CPU @ 2.80GHz
    Memory: 4.02 GB / 7.74 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 22.11.0 - /usr/local/share/nvm/versions/node/v22.11.0/bin/node
    Yarn: 1.22.22 - /usr/bin/yarn
    npm: 10.9.0 - /usr/local/share/nvm/versions/node/v22.11.0/bin/npm
    pnpm: 9.14.2 - /usr/local/share/nvm/versions/node/v22.11.0/bin/pnpm
  npmPackages:
    @sveltejs/adapter-auto: ^3.3.1 => 3.3.1 
    @sveltejs/adapter-vercel: ^5.4.7 => 5.4.7 
    @sveltejs/enhanced-img: ^0.4.1 => 0.4.1 
    @sveltejs/kit: ^2.8.1 => 2.8.1 
    @sveltejs/vite-plugin-svelte: ^4.0.1 => 4.0.1 
    svelte: ^5.2.0 => 5.2.7 
    vite: ^5.4.11 => 5.4.11

Severity

blocking all usage of SvelteKit

Additional Information

No response

eltigerchino commented 12 hours ago

The issue might be with StackBlitz. The image doesn't render either in this StackBlitz reproduction (without the vite server origin option configured): https://stackblitz.com/~/github.com/eltigerchino/sveltejs-kit-template-default-bu3iay . However, it does work locally.