Svelte应用部署GitHub Pages遇/_app/immutable/* 404错误求助

以下是针对该问题的具体排查和解决步骤：

• 配置SvelteKit的基础路径
  由于你的应用部署在GitHub Pages的子路径（/simpleport2/），需要在svelte.config.js中指定正确的base路径：

  import adapter from '@sveltejs/adapter-static';
  
  /** @type {import('@sveltejs/kit').Config} */
  const config = {
    kit: {
      adapter: adapter({
        // SPA模式下需配置fallback，避免路由刷新404
        fallback: 'index.html'
      }),
      paths: {
        base: '/simpleport2/'
      }
    }
  };
  
  export default config;
  

  该配置会让所有资源请求自动带上/simpleport2/前缀，避免因路径不匹配导致的资源找不到问题。

• 确认构建产物已正确推送到gh-pages分支
  检查你的gh-pages分支是否包含完整的构建产物：

  1. 本地执行npm run build（或对应包管理工具的build命令）生成dist目录
  2. 确认dist目录下存在/_app/immutable/文件夹及相关资源文件
  3. 使用gh-pages工具简化部署流程：
     • 安装依赖：npm install gh-pages --save-dev
     • 在package.json中添加部署脚本：

       "scripts": {
         "build": "vite build",
         "deploy": "npm run build && gh-pages -d dist"
       }
       

     • 执行npm run deploy，自动将dist目录内容推送到gh-pages分支

• 验证GitHub Pages部署设置
  进入仓库的Settings → Pages页面：

  • 确认部署源选择的是gh-pages分支的/root目录
  • 若存在缓存问题，可点击页面底部的"Clear cache"按钮，或使用浏览器无痕模式访问测试

• 检查资源路径引用
  确保代码中没有硬编码的根路径资源引用，比如避免直接写/assets/image.png，而是使用SvelteKit的$lib或import方式引入资源，让框架自动处理路径前缀。

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