Svelte应用404页面暴露主机目录结构，如何解决？

你遇到的问题是开发环境下默认错误页面会暴露本地目录路径，生产构建后默认不会出现这个问题，但开发阶段可以通过以下两种方式解决：

方案一：自定义+error页面（最稳妥通用） #

直接在项目的src/routes目录下创建+error.svelte文件，替换默认错误页面，示例内容：

<div style="text-align: center; padding-top: 60px;">
  <h1>404 - 页面不存在</h1>
  <p>请检查访问路径是否正确</p>
</div>

这个页面会在所有环境（开发/生产）下替代默认错误页，彻底避免路径泄露。

方案二：禁用开发环境的错误详情（无需自定义页面） #

如果不想写页面内容，只需要屏蔽敏感信息，可以修改配置：

1. 修改svelte.config.js，自定义错误处理逻辑：

import adapter from '@sveltejs/adapter-auto';

/** @type {import('@sveltejs/kit').Config} */
const config = {
  kit: {
    adapter: adapter(),
    errorHandle: {
      handleError: ({ error, event }) => {
        // 开发环境下返回通用错误提示
        if (import.meta.env.DEV) {
          return { message: '访问出错，请检查路径' };
        }
      }
    }
  }
};

export default config;

2. 或者修改vite.config.js关闭错误覆盖层的详细信息：

import { sveltekit } from '@sveltejs/kit/vite';

/** @type {import('vite').UserConfig} */
const config = {
  plugins: [sveltekit()],
  server: {
    errorOverlay: false
  }
};

export default config;

这样开发环境的错误页面只会显示通用提示，不会泄露本地目录结构。

另外提醒：生产构建（vite build）后的应用默认会隐藏所有敏感路径信息，这个隐私泄露问题仅存在于开发阶段。

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