如何解决SvelteKit 2中带与不带Slug的路由部署后失效问题？

核心问题 #

你当前的目录结构没遵循SvelteKit文件系统路由的规范：src/routes/something作为目录本身不会自动生成/something路由，必须在该目录下创建+page.svelte（或+page.js/ts）文件来对应这个路由。本地开发服务器的调试模式路由匹配逻辑更宽松，所以能正常工作，但静态适配器构建后会严格按规范生成文件，导致路由缺失。

具体修复步骤 #

1. 调整路由文件结构
   确保目录结构符合以下规范：

   src/routes/
   ├─ something/
   │  ├─ +page.svelte       # 对应 /something 路由的页面
   │  └─ [slug]/
   │     └─ +page.svelte    # 对应 /something/[slug] 动态路由
   

   把原本属于/something路由的页面代码放到src/routes/something/+page.svelte中，保留[slug]子目录的文件结构不变。

2. 修正静态适配器配置
   在svelte.config.js中确保adapter-static的配置适配CSR PWA场景：

   import adapter from '@sveltejs/adapter-static';
   
   export default {
     kit: {
       adapter: adapter({
         // 所有未匹配的路由都指向index.html，由客户端路由处理
         fallback: 'index.html'
       }),
       prerender: {
         // 完全CSR模式下，不需要预渲染任何页面，避免生成多余静态文件
         entries: []
       }
     }
   };
   

3. 重新构建验证
   执行npm run build后，检查build目录下是否生成了something/index.html（开启预渲染的情况），或者确认index.html作为fallback能正确加载客户端路由逻辑。部署后访问/something即可正常渲染页面。

额外注意事项 #

• 不要同时存在src/routes/something.svelte文件和src/routes/something/目录，这会引发路由冲突。
• 如果需要预渲染/something路由，可以在prerender.entries中添加'/something'，但CSR模式下通常不需要。

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