import * as foo (namespace) with stores breaks the svelte compiler

[samuelstroschein]

Describe the bug

Problem

ESM namespace imports import * as foo from "x" where x.foo is a store seems to break the Svelte compiler.

messages.ts

import { writable } from 'svelte/store';

export let loginButton = writable('Login');

App.svelte

<script lang="ts">
  import * as m from "./messages"
</script>

<p>{m.$loginButton}</p> // 💥 -> undefined
<p>{$m.loginButton}</p> // 💥 -> `m` is not a store with a subscribe method

The following works

App.svelte

<script lang="ts">
  import {loginButton} from "./messages"
</script>

<p>{$loginButton}</p> 

Why namespace support is of interest

Tree-shaking while retaining access to "many imports".

We are evaluating if we build the inlang i18n library for SvelteKit tree-shakable to solve one major complexity of i18n libs: don't ship unused translations. Using namespace syntax would resemble current i18n libraries which use t("key", { name: "inlang"} ). A namespace import would result in t.key({ name: "inlang" }) which provides autocomplete and familiarity.

Reproduction

https://stackblitz.com/edit/vitejs-vite-gvzxkv?file=src%2FApp.svelte

Logs

No response

System Info

See stackblitz reproduction

svelte: ^4.1.2 => 4.2.0

Severity

blocking an upgrade

[Conduitry]

This is the expected behavior. There's no way to automatically subscribe to a store unless it's a top-level variable in your component (#4079) and if you do a * as foo import, it's no longer a top-level variable.

[samuelstroschein]

@Conduitry Svelte 5 enables namespace imports via runes, correct?

[samuelstroschein]

Seems to work, see the playground example.