如何在Snowpack运行的Svelte应用中集成配置Routify

• 安装核心依赖：执行npm install @roxi/routify @roxi/routify-utils，不需要额外安装Rollup专属的适配包。
• 配置路由生成规则：在项目根目录创建routify.config.js，指定路由生成文件的输出路径为src/routes.gen.js，匹配Snowpack的模块扫描范围。
• 调整启动脚本：在package.json的scripts字段中，将开发启动、构建命令调整为先触发Routify的静态路由生成，再启动Snowpack服务，示例配置为：
  • 开发环境命令："dev": "routify -s && snowpack dev"
  • 生产构建命令："build": "routify -b && snowpack build"
• 完成应用入口挂载：在根组件App.svelte中导入@roxi/routify提供的<Routify>根组件，替换原有占位的路由挂载逻辑。

常见报错诱因：多数集成失败是因为直接照搬Routify官方文档中的Rollup插件配置，将Rollup格式的Routify插件加入Snowpack的插件列表——Snowpack的插件系统和Rollup的API不兼容，会直接触发模块初始化失败。

• svelte-spa-router：最轻量的纯ESM实现路径匹配路由，和Snowpack构建逻辑零适配成本，无需额外插件即可直接导入使用，支持嵌套路由、路径参数解析，无额外构建时编译流程，适合中小型Svelte SPA项目。
• abstract-state-router：支持路径匹配的状态型路由，内置Svelte渲染适配器，兼容Snowpack的模块拆分逻辑，支持路由守卫、异步路由加载，适合需要复杂路由权限控制的项目。
• page.js：极简的客户端路径匹配核心，可直接结合Svelte的响应式逻辑实现路由跳转，无固定组件封装，适配自由度极高，完全兼容Snowpack的原生ESM加载机制，不会触发构建兼容报错。

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