SvelteKit：复用JavaScript函数时page URL始终为undefined的问题

你的核心错误是没搞懂Svelte store的工作机制：page是Svelte提供的readable store，不是普通JavaScript对象，直接访问page.url根本拿不到实际的URL值——因为store的内部状态是被封装的，必须通过订阅或者get函数才能获取。

两种修正方案： #

方案1：在复用函数里用get同步获取store当前值

修改reusableScript.js，引入svelte/store里的get函数，用它读取page store的当前状态：

// reusableScript.js
import { page } from '$app/stores';
import { get } from 'svelte/store';

export default () => {
  return get(page).url;
}

这样调用script()时，就能直接拿到当前的URL值了。

方案2：返回store本身，在组件里用$前缀自动订阅

如果需要实时响应URL变化（比如路由切换时自动更新），可以让复用函数直接返回page store，然后在组件里用Svelte的$语法糖自动订阅：

// reusableScript.js
import { page } from '$app/stores';

export default () => {
  return page;
}

组件里调整为：

<!-- Component.svelte -->
<script>
  import { script } from '$lib';
  const pageStore = script()
</script>

<div>
  {$pageStore.url}
</div>

补充说明 #

你原来的代码里，page对象本身并没有url属性——它只是一个包含subscribe方法的store容器，内部状态需要通过特定方式读取，直接访问自然会得到undefined。

内容的提问来源于stack exchange，提问作者Lucas