如何实现EJS模板中<% %>等标签的Tab补全功能？

云上老周

2026-5-13

实现EJS标签<% %>、<%= %>的Tab补全方法

我之前也碰到过这个头疼的问题，试了几种方法终于搞定了，主要看你用的编辑器，这里我以最常用的VS Code为例给你说两种方案：

方案一：安装EJS语法扩展（最省心）

打开VS Code的扩展商店（左侧边栏的方块图标），搜索「EJS Language Support」，安装那个下载量最高的（一般是DigitalBrainstem开发的版本）。安装完成后重启编辑器，大部分情况下<% %>、<%= %>这类EJS标签的Tab补全就自动生效了，还能顺带解决EJS文件的语法高亮问题，一举两得。

方案二：自定义代码片段（更灵活）

如果扩展的补全逻辑不符合你的习惯，或者偶尔没生效，可以自己手动配置代码片段，完全按自己的需求来：

打开VS Code的命令面板（Windows按Ctrl+Shift+P，Mac按Cmd+Shift+P），输入「Configure User Snippets」后回车。
选择「ejs.json」（如果没有这个选项，就选「New Global Snippets file...」，命名为ejs.json即可）。
把下面的配置粘贴进去，保存文件：

{
  "EJS 输出表达式": {
    "prefix": "eje",
    "body": "<%= $1 %>",
    "description": "生成EJS输出标签<%= %>"
  },
  "EJS 脚本块": {
    "prefix": "ej",
    "body": "<% $1 %>",
    "description": "生成EJS脚本标签<% %>"
  },
  "EJS 文件引入": {
    "prefix": "ejinc",
    "body": "<%- include('$1') %>",
    "description": "生成EJS文件引入标签<%- include() %>"
  }
}

配置好之后，在EJS文件里输入ej按Tab就能快速生成<% %>，输入eje生成<%= %>，输入ejinc生成引入标签，完全适配自己的输入习惯。