VSCode 无法渲染 Hugo 模板，因其 Markdown 预览仅解析纯文本语法，不执行 Hugo 的模板逻辑（如{{.Title}}、shortcode）、不加载 layouts/static 资源，故必须依赖独立的 hugo server 进程在站点根目录运行，并通过浏览器访问 http://localhost:1313 查看真实效果。
VSCode 本身不运行 Hugo 预览，必须靠 hugo server 独立进程 + 正确工作目录 + 浏览器访问 http://localhost:1313 才能看到真实效果。
为什么 VSCode 的 Markdown 预览打不开 Hugo 模板？
VSCode 内置预览或 Markdown Preview Enhanced 只解析纯 Markdown 语法，完全跳过 Hugo 特有逻辑：
- {{ .Title }}、{{ .Date }} 原样显示，不替换
- {{% img %}} 或自定义 shortcode 直接消失或报错
- layouts/ 中的模板、static/ 下的 CSS/JS 全部不加载
- 主题样式、分页、归档页等动态结构全不可见
这不是插件没装对，而是架构层面的隔离——Hugo 是构建时渲染引擎，VSCode 预览是客户端文本解析器，二者不兼容。
启动 hugo server 必须满足的三个条件
缺一不可，否则页面白屏、404 或只显示首页：
- 终端当前路径必须是 Hugo 站点根目录（含
config.toml和content/） - 确保已正确设置主题：
theme = "ananke"等写入config.toml，且themes/ananke/目录存在 - 草稿文章需显式加
-D参数：hugo server -D，否则draft: true的文章不会出现在本地服务中
常见错误：hugo server 在 content/posts/ 下执行 → 报错 “Unable to locate config file”；用 Live Server 插件右键打开 index.html → 样式错乱、链接 404。
VSCode 插件怎么配才不干扰 Hugo 工作流？
目标不是“让 VSCode 预览 Hugo”，而是“让编辑更顺、不抢端口、不掩盖真实问题”：
- 装
Markdown All in One：绑定toggle code block到Shift + `，避免手敲``` - 装
Hugo Language and Syntax Support：开启hugo.languageServer.enabled，获得config.toml字段提示 - 禁用
Markdown Preview Enhanced的内置服务器（设置里关掉markdown-preview-enhanced.startServerOnOpen），防止它占用:1313端口 - 不用
Live Server插件预览 Hugo 页面——它不理解public/目录结构，也不走 Hugo 路由规则
写作时保持「双窗口」：左边 VSCode 编辑 content/posts/foo.md，右边浏览器固定打开 http://localhost:1313，保存即刷新。
后台运行 hugo server 的安全姿势
想关终端又不让服务停？别直接 Ctrl+C 后再 &，容易漏参数或路径错：
- 先确认在站点根目录，运行：
nohup hugo server -D --port=1313 --bind=0.0.0.0 > /dev/null 2>&1 & -
nohup防终端退出中断，> /dev/null 2>&1屏蔽日志干扰，--bind=0.0.0.0允许局域网设备访问（调试手机端响应式时有用） - 查进程用：
ps aux | grep hugo；杀掉用：kill $(pgrep -f "hugo server")
真正容易被忽略的是：每次换主题或改 config.toml 后，hugo server 不会自动重载配置项（比如 baseURL 或 languageCode），必须手动重启进程。
