sublime text 在 nuxt 3 混合渲染中基本不可用，因其缺乏 definerouterules 语法提示、无法识别 useasyncdata 的 ssr/csr 上下文、不可感知 nitro 构建产物结构。
Sublime Text 本身不支持 Nuxt 3 混合渲染的开发流程，强行用它做主力编辑器会卡在关键环节：没有 defineRouteRules 的语法提示、无法识别 useAsyncData 的 SSR/CSR 上下文、构建时看不到 Nitro 输出结构。你得先接受这个前提，再决定要不要绕路。
为什么 Sublime Text 在 Nuxt 3 混合渲染中基本不可用
Sublime Text 缺少对 Vue SFC（.vue）文件中 <script setup></script> + defineRouteRules 组合的语义解析能力。Nuxt 3 的混合渲染依赖两个核心机制：
-
defineRouteRules必须在页面组件顶层调用，且仅在构建时生效 —— Sublime Text 不会校验它是否写在正确位置，也不会提示prerender、ssr、swr等合法字段 - Nitro 构建产物（
.output目录）的生成逻辑和路由映射关系，Sublime Text 完全无法感知，你改了routeRules配置却看不到静态 HTML 是否真被产出 - 调试
useAsyncData在 SSR 和 CSR 中的不同行为时，Sublime Text 无法高亮显示服务端/客户端执行路径差异，容易误判数据双发问题
如果非要用 Sublime Text，必须补哪些硬性条件
不是不能用，而是要手动补足 IDE 层缺失的能力，否则连基础验证都做不到：
PigX UI 前端开发
下载
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
- 必须启用
Vue Syntax Highlight插件，并手动配置Vue Component语法作用域，否则<script setup></script>里的defineRouteRules会被当成普通 JS 报错 - 必须配合命令行高频验证：
nuxt build后立刻检查.output/public下是否有对应路径的 HTML 文件（如/about/index.html），否则不知道static: true是否生效 - 必须手动读
.output/server/index.mjs的路由注册逻辑，确认/products/**这类带通配符的swr规则是否被 Nitro 正确注入到边缘函数逻辑里 - 禁用所有自动保存格式化插件 —— Sublime 的 Prettier 或 JSBeautify 会破坏
<script setup></script>中的顶层调用约束，导致defineRouteRules被包裹进函数作用域而失效
真正影响混合渲染效果的代码写法细节
哪怕你换回 VS Code，以下三点仍极易出错，Sublime Text 用户只会更难发现：
-
defineRouteRules({ ssr: false })放在pages/user/[id].vue里，但该页面用了useAsyncData请求用户数据 —— 这会导致客户端首次加载时白屏，因为服务端跳过渲染，而useAsyncData默认不 fallback 到客户端获取 -
routeRules中配置'/api/**': { cors: true }，但实际 API 是通过server/api目录写的 —— Nitro 只认server/api下的文件，routeRules对它无效，CORS 需在server/api/xxx.ts里显式设置响应头 - 在
app.vue布局中使用useState存储全局状态，但没加key参数 —— 混合渲染下，不同路由间水合（Hydration）会复用该状态，造成跨页数据污染
混合渲染不是开关一开就快，而是每条 routeRules、每个 defineRouteRules、每次 useAsyncData 调用，都要对应到具体的构建产物和运行时行为。Sublime Text 提供不了这些反馈链路，你得自己当编译器和调试器。这不是工具选择问题，是工作流断点问题。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
