Svelte中如何捕获.env文件未找到或变量缺失的错误？

SvelteKit已经内置了环境变量的加载逻辑，不需要手动用fs或dotenv，可以通过以下方式实现清晰的错误提示：

1. 提供.env示例模板（根源避免错误） #

在项目根目录创建.env.example文件，写明需要配置的变量和示例值：

# 复制此文件并重命名为.env，修改为你的实际配置
PUBLIC_URL=https://your-app-domain.com

这样克隆仓库的用户能直接看到需要配置的内容，减少遗漏。

2. 运行时校验并抛出清晰错误 #

方式一：在根布局中做全局校验 #

在src/routes/+layout.svelte中添加校验逻辑，确保变量存在：

<script>
  import { PUBLIC_URL } from '$env/static/public';

  if (!PUBLIC_URL) {
    throw new Error('配置错误：请在项目根目录创建.env文件，并配置PUBLIC_URL环境变量。可参考.env.example文件的格式');
  }
</script>

当变量缺失时，页面会抛出明确的错误信息，替代默认的500错误。

方式二：在服务端钩子中提前拦截 #

如果希望在请求到达页面之前就拦截错误，使用src/hooks.server.js：

import { PUBLIC_URL } from '$env/static/public';

export async function handle({ event, resolve }) {
  if (!PUBLIC_URL) {
    return new Response('配置错误：请创建.env文件并设置PUBLIC_URL变量，可参考.env.example模板', { status: 400 });
  }
  return resolve(event);
}

用户访问页面时会直接看到400状态码和清晰提示，无需查看控制台。

注意事项 #

• 不要手动引入dotenv，SvelteKit会自动加载根目录的.env、.env.local等文件（开发模式），生产环境则读取系统环境变量
• PUBLIC_前缀的变量会暴露给客户端，非公开变量不要加这个前缀

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