effect_orphan Error When Importing .svelte Files from Another Package in Svelte 5 with esbuild

[reckart]

I'm running into issues using Svelte 5 with esbuild when importing .svelte files from another package.
This setup worked fine in Svelte 4, but in Svelte 5 I'm seeing the following error:

effect_orphan: `$effect` can only be used inside an effect

My Setup

• I'm using esbuild with esbuild-svelte and svelte-preprocess
• I import .svelte components directly from another package (uncompiled .svelte files)
• The imported components use $effect internally

In Svelte 4, this worked without problems. In Svelte 5, I consistently hit this effect_orphan error — which seems to suggest that effects are not properly registered or that component code isn't being compiled in the expected context.

Workaround

If I copy the component into my app instead of importing it from the package, it works.

Questions

Is there something special required to support $effect/Svelte 5 reactivity when importing non-precompiled .svelte files using esbuild?

[Ocean-OS]

Could you provide a reproduction, either via the playground or by sharing a link to a repository?

[reckart]

Here is a link to the branch/repo I am currently working on. In this branch, I had to copy the AnnotationDetailPopOver.svelte locally into various modules because otherwise I would get the error. The original imports in those modules are commented out.

inception-project/inception@01b5894

[reckart]

Ok, what seems to fix the problem is adding this alias to the esbuild configuration:

  // Ensure Svelte runtime is shared across all components: Whenever you see an 
  // "import from 'svelte'"", resolve it once and reuse that same resolution everywhere.
  alias: {
    'svelte': 'svelte'
  }