SvelteKit构建报错：a标签引用routes子文件夹下路由构建失败如何解决？

• 路由尾部斜杠规则不匹配：SvelteKit 生产构建阶段默认开启严格的路由路径校验，你在resources.svelte中定义的链接为/resources/ink-archive/（带尾部斜杠），而routes/resources/ink-archive.svelte默认生成的路由路径为/resources/ink-archive（不带尾部斜杠），构建预渲染时路径匹配失败触发500错误。本地开发环境无严格预渲染校验，因此运行无异常。
• 预渲染阶段执行报错：如果项目开启了预渲染配置，且ink-archive.svelte中存在仅能在浏览器端执行的代码（比如直接调用window、document等客户端专属API，未做服务端兼容），服务端预渲染时代码执行失败会直接导致构建中断报错。
• 路由文件不符合版本规范：若你使用的是SvelteKit v1.0及以上版本，旧版的文件路由规则已经失效，新版要求页面路由文件必须命名为+page.svelte并存放在对应路径的目录下，不符合规范的路由文件无法被正确识别。

• 统一尾部斜杠规则
  你可以任选一种方式匹配规则：

  1. 修改链接写法，移除尾部斜杠：<a href="/resources/ink-archive">
  2. 在svelte.config.js中配置全局尾部斜杠规则，和现有链接写法匹配：

  export default {
    kit: {
      trailingSlash: 'always'
    }
  }
  

  可选配置值：always（所有路由强制加尾部斜杠）、never（所有路由强制移除尾部斜杠）、ignore（不校验尾部斜杠）。

• 修复预渲染兼容问题

  1. 对客户端专属执行逻辑加环境判断，SvelteKit v1.0+示例：

  import { browser } from '$app/environment';
  if (browser) {
    // 所有操作window、DOM、客户端存储的逻辑都放到该判断块内
  }
  

  旧版本SvelteKit可使用if (process.browser)做判断。
  2. 若不需要预渲染该页面，直接在页面顶部导出配置关闭预渲染：

  export const prerender = false;
  

• 适配新版路由规范
  如果你使用SvelteKit v1.0+版本，调整路由文件结构：

  • 将原routes/resources.svelte改为routes/resources/+page.svelte
  • 将原routes/resources/ink-archive.svelte改为routes/resources/ink-archive/+page.svelte

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