SvelteKit已禁用SSR仍出现SSR模块评估错误怎么解决？

问题根因 #

你已经正确配置禁用了SSR，该报错仅出现在开发环境，核心原因是你导入的./../helpers/Yrtc模块在顶层作用域直接调用了localStorage：

• 即使你把Yrtc的实例化逻辑放在onMount中，静态import语句会在模块加载阶段就执行对应依赖的顶层代码
• SvelteKit开发模式下会默认在服务端侧做一次模块求值校验，哪怕你关闭了SSR，这个开发阶段的校验逻辑仍然会触发，于是就出现了服务端环境不存在localStorage的报错。生产构建后该报错会自动消失，因为所有代码只会在客户端环境运行。

你当前在路由模块脚本中声明的export const ssr = false和全局svelte.config.js中的配置重复，可以直接删除，全局配置已经对所有路由生效。

解决方案 #

可根据实际情况选择以下任意一种方式修复：

• 修改Yrtc模块，把顶层调用localStorage的逻辑迁移到类的构造函数或者实例方法内，确保localStorage只有在类实例化的时候才会被调用，配合你现有onMount内实例化的逻辑即可解决问题。
• 如果不想改动Yrtc模块的代码，把静态导入改为onMount内的动态导入：

<script lang="ts">
    import { onMount } from "svelte";

    onMount(async () => {
        const { default: Yrtc } = await import("./../helpers/Yrtc");
        const yrtc = new Yrtc({
            roomId: 'tet-riieiiasds-di'
        })
        console.log({yrtc})
    })
</script>

• 仅需要临时屏蔽开发环境报错的话，在Yrtc模块所有调用localStorage的位置增加运行环境判断：

const safeLocalStorage = typeof window !== 'undefined' ? window.localStorage : undefined
// 后续所有用到localStorage的地方都替换为safeLocalStorage

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