EJS不能在浏览器中直接运行,因其无原生runtime,仅支持服务端渲染(如Express)或预编译为静态HTML;浏览器端引入ejs.js已弃用且不可靠。

不能直接在纯 HTML 文件里“引入 EJS”并让它运行 —— EJS 不是浏览器原生支持的模板语法,ejs 本身没有浏览器端 runtime,所谓“HTML 中引入 EJS”实际只有两种可行路径:服务端渲染(Node.js + Express)或预编译构建(CLI 工具生成静态 HTML)。想靠 <script src="ejs.js"></script> 在浏览器里跑 .ejs 文件,基本会失败或被弃用。
Express 项目中配置 EJS 渲染 HTML 视图
这是最常见、也最可靠的用法:让 Express 把 .ejs 当作视图模板,但输出为 .html 后缀的响应内容。关键不是“让 HTML 认识 EJS”,而是让服务器把 EJS 编译结果当作 HTML 返回。
-
app.set("view engine", "ejs")是默认方式,模板文件必须用.ejs后缀,比如index.ejs - 若坚持用
.html作为模板后缀(例如已有大量.html文件),需额外配置:app.engine("html", require("ejs").__express)+app.set("view engine", "html") - 必须设置视图目录:
app.set("views", path.join(__dirname, "views")),否则res.render("index")找不到文件 - 注意:EJS 模板里写的
<%= name %>或<% if (user) { %>都是在 Node.js 进程里执行的,浏览器收到的只是最终 HTML 字符串,看不到任何 EJS 标签
用 ejs-cli 预编译 .ejs 到静态 HTML
适合无后端场景(如文档站、营销页),把 EJS 当作构建时的模板工具,输出纯 HTML 文件。不依赖服务器,也不需要 require("ejs")。
- 全局安装:
npm install -g ejs-cli - 命令行编译:
ejs-cli -f template.ejs -o dist/index.html -O '{"title":"Home"}' -
-O参数必须是合法 JSON 字符串,且外层用单引号包裹(双引号在 shell 里容易出错) - 模板中用
<%= title %>输出转义内容,用<%- content %>输出未转义 HTML —— 这点和运行时行为一致 - 不支持
include或layout等高级功能,除非自己写脚本链式调用
为什么不要在浏览器里直接加载 ejs.js?
早期确实有 ejs_production.js 这类浏览器版,但已多年未维护(最后更新在 2014 年),现代 EJS 官方明确不推荐客户端使用。问题不止于兼容性:
立即学习“前端免费学习笔记(深入)”;
- 浏览器环境无法读取本地
.ejs文件(CORS 限制),new EJS({url: "page.ejs"})基本 404 - 没有模块系统支持,
require、__dirname等 Node.js 特有变量不存在 - 同步 AJAX 加载模板在现代浏览器中已被禁用(
XMLHttpRequest同步阻塞) - 即便强行注入,
<%= data.name %>会被 HTML 解析器当成普通文本,不会执行
EJS 的核心价值在于服务端数据绑定与结构复用,它不是前端框架的替代品。真要动态渲染,该用 innerHTML + 字符串模板,或选 mustache、handlebars 这类明确支持浏览器运行的引擎。混淆“模板语法”和“模板执行环境”,是踩坑最常见的起点。



















