Sublime Text中如何在HTML嵌入Lua代码并实现语法高亮与自动补全

1. 安装适配的语法高亮包 #

打开Sublime Text的Package Control（快捷键Ctrl+Shift+P/Cmd+Shift+P，输入Install Package），搜索并安装支持HTML嵌入Lua的语法包，比如HTML-Lua这类（如果存在）。这类包会自动识别<? ?>标签内的Lua代码，同时保留HTML的语法高亮。

2. 手动自定义语法规则（如果没有现成包） #

如果找不到合适的现成包，可以自己修改语法定义文件：

• 复制Sublime Text自带的HTML语法文件（路径一般是Packages/HTML/HTML.sublime-syntax），重命名为HTML-Lua.sublime-syntax。
• 在文件中添加规则，匹配<?和?>之间的内容：

  contexts:
    main:
      - include: lua-embedded
      # 保留原有的HTML规则...
    lua-embedded:
      - match: '<\?'
        push: lua-content
      - match: '\?>'
        pop: true
    lua-content:
      - include: scope:source.lua
  

• 保存后，在Sublime Text中通过View > Syntax > User > HTML-Lua切换到这个自定义语法。

3. 配置自动补全 #

要实现Lua和HTML的自动补全同时生效：

• 确保已经安装Lua相关的补全包（比如LuaDev）。
• 确认自定义的HTML-Lua.sublime-syntax中，lua-content部分正确关联了source.lua的作用域，这样Sublime Text会自动调用Lua的补全逻辑；同时HTML部分的标签补全也会正常工作。

测试示例代码 #

用你提供的代码验证效果：

<!DOCTYPE html>
<html>
    <head><title>Test</title></head>
    <body>
        <? local n = 3 ?>
        <h1>Test number <? print(n) ?></h1>
    </body>
</html>

切换到自定义的HTML-Lua语法后，<? ?>内的Lua代码会有正确的语法高亮，输入Lua代码时也会触发自动补全，HTML部分的标签补全同样正常。

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