在前面的練習中，我們使用符號在元件內部添加響應性。但我們也可以在元件外部使用符號，例如共享一些全域狀態。

這個練習中的 <Counter> 元件都從 shared.js 導入 counter 物件。但它是一個普通的物件，因此當您點擊按鈕時不會發生任何事情。將物件包裝在 $state(...) 中

export const counter = $state({
	count: 0
});

這會導致錯誤，因為您不能在普通的 .js 檔案中使用符號，只能在 .svelte.js 檔案中使用。讓我們修正這個問題——將檔案重新命名為 shared.svelte.js。

然後，更新 Counter.svelte 中的 import 宣告

<script>
	import { counter } from './shared.svelte.js';
</script>

現在，當您點擊任何按鈕時，三個按鈕都會同時更新。

如果宣告被重新賦值（而不是僅僅被改變），您不能從模組中匯出 $state 宣告，因為導入者將無法知道它。