Error with external Svelte 5 components

[legowhales]

Describe the bug

Using svelte-preprocess with Svelte 5 and importing a Svelte 5 component from an npm package triggers an error:
'p' has already been declared

Detailed error with a random package

Same error occurs with bits-ui@next, svelte-clerk...

✘ [ERROR] node_modules/ui-ingredients/dist/select/item-text.svelte:9:24 `p` has already been declared [plugin vite-plugin-svelte:optimize-svelte]

    node_modules/ui-ingredients/dist/select/item-text.svelte:9:24:
      9 │        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.l...
        ╵                         ^

  The plugin "vite-plugin-svelte:optimize-svelte" was triggered by this import

To Reproduce

I made a simple example here:

https://stackblitz.com/edit/sveltejs-kit-template-default-u71xqf?file=svelte.config.js

Is there a simple way to make it work?
Thank's for your help.

[dummdidumm]

The problem is that svelte-preprocess searches for a tsconfig.json but doesn't find one and therefore falls back to an old target version which includes a down-level-transpilation of the ...rest syntax. That subsequently messes with Vite for some reason.

You can fix this by changing your jsconfig.json to a tsconfig.json.

We should probably also search for a jsconfig.json in the TypeScript preprocessor, if we don't find a tsconfig.json - even if it's a bit weird because why would someone have a jsconfig.json if they're using a TS preprocessor.

[legowhales]

Hum... well in my case I already have a tsconfig.json. But the sveltekit project is in a subfolder (in a monorepo without a tsconfig at the root level). Would that trigger the same issue as well?

I tried adding a tsconfig.json at the root of the repo, but I get the same issue.

[dummdidumm]

Does the SvelteKit project in which you have this error have a tsconfig.json? What happens if you set the tsconfigDirectory option?

[legowhales]

Yes it has.
I tried to set isconfigDirectory, but nothing changes. I updated the stackblitz example to show you the issue: https://stackblitz.com/edit/sveltejs-kit-template-default-u71xqf?file=app%2Ftsconfig.json

[dummdidumm]

What error should I be expecting in that stackblitz example? The image loads up and there's no error in the Stackblitz console.

[legowhales]

Oh yeah you are right. I made other tests since the last comment. What you where seeing is when we use the preprocessor from @sveltejs/vite-plugin-svelte. I just modified back to using svelte-preprocess, you should see the error now.

Thank you for your help.

[timlohse1104]

Did you find a solution yet?

[huntabyte]

I'm currently experiencing an issue with TailwindCSS v4 which appears to use svelte-preprocess within its @tailwindcss/vite plugin and am getting similar outputs, though unsure if it's 100% related or not tailwindlabs/tailwindcss#15250

[huntabyte]

Here's a reproduction @dummdidumm https://github.com/huntabyte/tw-v4-monorepo-repro/tree/main - @tailwindcss/vite uses svelte-preprocess, as soon as that plugin is added to the plugins array of the vite config everything crashes.

Does @tailwindcss/vite need to do some detection of the tsconfig and include it when invoking sveltePreprocess for this to work? Or is there a way we could get around this when a dependency is the one using sveltePreprocess 🤔

[sgcullen]

To add to this, I'm also experiencing the issue @huntabyte is seeing when trying to set up tailwind v4.0 beta.

[huntabyte]

It looks like the specific issue we're running into will be resolved via this PR in Tailwind tailwindlabs/tailwindcss#15274 @sgcullen (they don't need to use the preprocessor).

[CollierCZ]

This turned up for someone else not using Tailwind (ascorbic/unpic-img#752). In that case, there was a tsconfig.json file in the specific directory, but not in the root of the monorepo. Adding one to the root (with just extending the one in the app directory) seemed to solve the issue.

[legowhales]

This turned up for someone else not using Tailwind (ascorbic/unpic-img#752). In that case, there was a tsconfig.json file in the specific directory, but not in the root of the monorepo. Adding one to the root (with just extending the one in the app directory) seemed to solve the issue.

You're awesome, that did it! Thank's a lot!