SvelteKit中Leaflet.heat刷新报错：Leaflet.heatLayer不是函数

我正在将现有Angular应用迁移到Svelte/SvelteKit，目标是实现带有热力图图层的Leaflet地图。目前地图主体运行稳定，但热力图仅在应用首次初始化时能正常加载；刷新页面后控制台会抛出错误：

Uncaught (in promise) TypeError: Leaflet.heatLayer is not a function

该错误直接导致Map.svelte组件完全无法加载。

怀疑原因 #

我认为问题与生命周期的导入处理逻辑有关：在Angular中无需在生命周期方法内导入依赖即可正常运行，但SvelteKit中必须通过异步方式导入Leaflet才能渲染地图，这可能与热力图的加载时机产生冲突。

已尝试的解决方法 #

• 在app.html、__layout.svelte、index.svelte中通过<script>标签引入node_modules目录下的leaflet-heat.js文件
• 在Map.svelte组件顶部直接导入leaflet.heat，触发错误ReferenceError: window is not defined
• 在赋值heatLayer前调用tick()方法，未解决问题

相关资源 #

• 项目代码仓库：leaflet-playground
• Leaflet.heat官方仓库

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