Haml和Slim模板在VSCode中需手动设置语言模式并安装专用Prettier插件才能正常高亮、缩进和格式化；否则会因识别为Plain Text或HTML导致缩进错乱、Tab失效及格式化塌陷。
Haml 和 Slim 模板在 VSCode 中默认无高亮、缩进错乱、Tab 展开失效——根本原因不是插件没装，而是语言模式未识别 + Prettier 默认不兼容这两类缩进敏感语法。
确认 .haml/.slim 文件被识别为对应语言模式
VSCode 不会自动把 .haml 或 .slim 文件当 Haml/Slim 处理。右下角显示 “Plain Text” 或 “HTML” 就说明卡在这一步。
- 打开任意
.haml文件，点击右下角语言标签 → 输入haml→ 选中 “Haml”（注意不是 “HTML” 或 “Ruby”） - 同理，
.slim文件要手动设为 “Slim”，不是 “HTML” 或 “Plain Text” - 永久绑定：按
Ctrl+,打开设置 → 搜索files.associations→ 在settings.json中添加："*.haml": "haml", "*.slim": "slim"
- 重启 VSCode 或执行
Developer: Reload Window
安装并启用 Haml/Slim 专用格式化插件
Prettier 默认不支持 Haml/Slim；强行用它格式化会导致缩进塌陷、%div 变成平铺、甚至删掉换行——因为 Haml 依赖空格层级表达嵌套，而 Prettier 把它当 HTML 重排。
- Haml 必装：
prettier-plugin-haml（不是prettier-plugin-ham，少一个l会报错）：npm install --save-dev prettier-plugin-haml - Slim 推荐：
prettier-plugin-slim（需项目级安装，全局无效）：npm install --save-dev prettier-plugin-slim - 确保
prettier本身已安装（v3.0+），且 VSCode 已装esbenp.prettier-vscode插件 - 验证是否生效：在
.haml文件中写一段缩进结构，保存后观察是否保持层级而非压成一行
避免缩进错乱与格式化失效的配置要点
即使插件装了，仍可能格式化失败或缩进跳变——问题常出在配置覆盖、缩进值冲突或语言服务未加载。
- 禁用 Ruby 插件的自动格式化：某些 Ruby 扩展（如
rebornix.ruby）自带格式器，会和 Prettier 抢控.haml文件，建议关闭："ruby.format.enable": false - 明确设置 Haml/Slim 的默认 formatter：
"[haml]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[slim]": { "editor.defaultFormatter": "esbenp.prettier-vscode" } - 不要设
editor.detectIndentation: true—— Haml/Slim 对缩进极其敏感，VSCode 自动探测常误判为 2 空格，而项目实际用 4 空格，导致展开/缩进错位 - 检查
prettier.tabWidth是否与团队约定一致（Haml 社区多用 2，Slim 常见 2 或 4），不一致时缩进视觉混乱
Snippets 补全与常见错误排查
Haml layout 片段（如 layout + Tab）需要手动注册，否则只高亮不补全；而拼错 %h1 写成 %h2 这类错误，不会报错，但渲染结果异常。
- 在
settings.json中添加自定义 snippet（以 Haml layout 为例）："Haml basic layout": { "scope": "haml", "prefix": "layout", "body": [ "%html", " %head", " %title= content_for?(:title) ? yield(:title) : 'My App'", " %body", " = yield" ], "description": "Basic Haml layout structure" } - 输入
layout后按Tab，若未展开，检查：snippet scope 是否为haml（不是ruby）、文件语言模式是否为 Haml - 常见报错：
Error: Cannot find module 'prettier-plugin-haml'→ 检查是否在项目根目录安装，且prettier配置中启用了该插件："prettier.plugins": ["prettier-plugin-haml"]
- Slime 格式化后属性挤成一行？确认
prettier-plugin-slim支持你用的 Slim 版本（v4.0+ 推荐）
真正容易被忽略的是：Haml/Slim 的格式化高度依赖项目级 prettier 配置存在且可读取；工作区没 .prettierrc 或插件找不到 node_modules 里的 plugin，就会静默退回到无格式化状态——此时看起来“能保存”，实则什么都没做。
