Sublime Text 默认不识别 .tag 文件,需手动设置语法为 HTML、配置缩进及 Emmet 的 syntax_profiles 为 "HTML":"html|tag",并用 live-server 启动项目以支持自动刷新和跨域加载。

Sublime Text 默认不识别 .tag 文件,直接打开就是纯文本——高亮失效、缩进错乱、Emmet 不响应,不是你配错了,是它根本没被当 HTML 处理。
如何让 .tag 文件获得 HTML 语法高亮和正确缩进
Sublime 不自带 Riot.js 语法支持,最稳的方案是把 .tag 当 HTML 用:
- 右键任意
.tag文件 → Set Syntax → 选 HTML - 按
Ctrl+Shift+P输入Preferences: Settings – Syntax Specific回车 - 在右侧用户设置中填入:
{"tab_size": 2,"translate_tabs_to_spaces": true,"detect_indentation": false} - 保存后,该后缀文件就固定用 2 空格缩进,且不会被 Sublime 自动重置
注意:别装网上搜到的老版 RiotJS 插件(比如 2015 年发布的),它们已停更,会和 View In Browser 冲突,报 Unable to find file 错误。
为什么 Emmet 在 .tag 里按 Tab 没反应
Emmet 默认只对 .html 后缀生效,即使你设了 HTML 语法,它仍会因后缀不是 .html 而跳过。必须显式告诉 Emmet:.tag 也属于 HTML 语境:
DMap GL地图JSAPI(dmapgl)开发指南。用于编写、审查、调试 DMap 地图 API 代码,涵盖地图初始化、覆盖物渲染、图层管理、事件处理、控件交互等任务。当用户提及 dmap、dmapgl、jsapi‑gl 或相关地图开发需求时自动触发。
- 菜单栏 Preferences → Package Settings → Emmet → Settings
- 在右侧用户设置中加入:
"syntax_profiles": {"HTML":"html|tag"} - 确认
abbreviations下已有html配置(默认就有,不用动) - 重启 Sublime,或按
Ctrl+Shift+P输入Emmet: Refresh Syntax List执行一次
之后在 .tag 里写 div.my-comp>p{hello}+span + Tab 就能展开;<script type="riot"> 块内写 const 也能触发 JS 补全(前提是装了 ES6 Syntax 或 JavaScript Next)。
保存后页面不自动刷新?得靠 live-server 配合 riot.mount()
Sublime 本身不运行代码,.tag 文件只是模板源码,必须通过 HTML 入口加载才能渲染:
- 确保
index.html中引入了riot.js(CDN 或本地) - 在
<body>内放一个挂载点,比如<my-tag></my-tag> - 末尾加脚本:
<script>riot.mount('my-tag')</script> - 用
live-server启动项目目录(npx live-server),而非直接双击打开index.html——否则无法跨域加载.tag文件
live-server 会监听 .tag 变更并自动刷新,但要注意:Riot 的组件名必须和文件名一致(my-tag.tag 对应 <my-tag>),大小写和连字符都不能错。
最容易漏掉的是 syntax_profiles 那一行配置——少了它,Emmet 就永远不认 .tag;还有 live-server 启动方式,直接双击打开 index.html 会导致 XMLHttpRequest 报错,页面空白也不报错,只在控制台里藏一条跨域提示。

















