Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
UltraCakeBakery opened this issue Nov 24, 2024 · 1 comment

Comments

@UltraCakeBakery
Copy link

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
Copy link
Member

eltigerchino commented Nov 25, 2024

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants