ECT API参考大全render、compile、clearCache等核心方法与选项参数详解【免费下载链接】ectFastest JavaScript template engine with embedded CoffeeScript syntax项目地址: https://gitcode.com/gh_mirrors/ect/ectECTECT 模板引擎是一款以性能著称的 JavaScript 模板引擎内置 CoffeeScript 语法。本文是一份完整的 ECT API 参考指南逐个详解render、compile、clearCache、configure等核心方法与全部选项参数帮你快速上手这个轻量而强大的模板工具。 什么是 ECT 模板引擎ECT 将模板文件编译为 JavaScript 函数渲染速度非常快同时支持模板缓存、模板继承、局部模板partials与代码块blocks等实用特性。它同时适用于 Node.js 服务端和浏览器端并且兼容 express 框架。核心 API 全部实现在 lib/ect.js 中项目入口文件为index.js。快速安装npm install ect也可以克隆源码到本地研究git clone https://gitcode.com/gh_mirrors/ect/ect⚡ 创建渲染器ECT() 构造函数使用 ECT 的第一步是创建一个渲染器实例。调用ECT(options)时传入一个选项对象所有选项都会写入实例的options属性之后可通过configure方法再次修改var ECT require(ect); var renderer ECT({ root: __dirname /views, ext: .ect });root还可以传入一个JavaScript 对象直接以内存中的字符串作为模板免去文件读取var renderer ECT({ root: { layout: htmlheadtitle%- title %/title/headbody% content %/body/html, page: % extend layout %pPage content/p } }); 选项参数一览Renderer Options选项说明默认值root模板根目录字符串路径或包含模板的 JS 对象ext模板文件扩展名仅对目录形式的root生效cache是否缓存已编译的模板函数truewatch缓存开启时模板文件变更后自动重新加载falseopen模板开始标签%close模板结束标签% 小提示开启watch: true配合cache: true是调试阶段的最佳组合——既有缓存性能又能实时看到模板修改效果该特性仅服务端支持。️ 核心方法详解1. render 方法同步与回调两种写法render是最高频的 API负责加载模板、编译并输出 HTML 字符串。它支持同步和回调两种调用方式。同步调用参数模板名、数据对象var html renderer.render(page, { title: Hello, World! });回调调用参数模板名、数据对象、回调函数renderer.render(page, { title: Hello, World! }, function(error, html) { console.log(error); console.log(html); });回调形式还支持省略数据对象直接传入回调此时模板内使用空数据渲染renderer.render(page, function(error, html) { // 出错时 error 有值成功时 html 为渲染结果 }); 数据对象中的变量在模板里用前缀访问例如数据{ title: Hi }对应模板中的title。完整示例可参考examples/example.js。2. compile 方法手动编译模板源码compile接收一段模板源码字符串直接编译为可执行的渲染函数跳过文件加载步骤适合动态生成模板或做二次封装var compiled renderer.compile( % for item in items : %li% item %/li% end % );编译成功后得到一个函数调用时把上下文context、fileInfo、include、content、block作为参数传入即可执行。若模板语法有误抛出的错误信息会指明出错位置方便排查。3. clearCache 方法清空模板缓存ECT 默认把编译结果缓存在内存中cache默认为true。当你绕过 watch 机制手动修改了模板文件缓存不会自动失效此时就需要clearCache出手renderer.clearCache(); // 清空全部模板缓存 renderer.clearCache(page); // 只清空指定模板的缓存⚠️ 常见坑改了模板却没生效90% 是因为开了缓存。要么调用clearCache要么开启watch: true。4. configure 方法运行时修改选项实例创建后想改配置用configure传入新的选项对象即可它会与现有选项合并只覆盖你传入的键renderer.configure({ watch: true }); renderer.configure({ open: {{, close: }} }); // 自定义标签风格5. compiler 方法服务端编译中间件compiler返回一个 connect 风格的中间件用于服务端预先编译模板并以 JS 资源形式下发给浏览器客户端无需再携带 CoffeeScript 编译器大幅减小前端体积。参数说明默认值rootURL 基础路径需与客户端root配置一致/gzip是否使用 gzip 压缩编译后的模板falsevar renderer ECT({ root: __dirname /views, ext: .ect }); app.use(renderer.compiler({ root: /views, gzip: true }));客户端只需要加载ect.min.js然后renderer.render(template, data)即可模板由服务端中间件动态提供。使用示例见examples/compiler.js。 常用模板标签速查API 之外模板内这些标签是使用render时必须了解的基础标签作用% someVar %转义输出变量防 XSS%- someVar %不转义输出变量% 代码 %执行 CoffeeScript 代码支持多行% include partial %引入局部模板可传自定义数据% extend layout %声明继承的父模板% content %父模板中插入子模板的正文% block name : % ... % end %定义可被子模板重写的代码块% content name %父模板中插入指定代码块examples/view/目录下的layout.html、sublayout.html、page.html展示了多层继承 blocks 的完整写法是学习模板语法的好材料。 缓存策略最佳实践场景推荐配置说明生产环境cache: true默认编译一次复用函数性能最佳开发调试cache: true, watch: true自动重载变更模板频繁手动改模板改完调用clearCache()手动失效缓存关闭缓存cache: false每次渲染都重新编译仅排查问题时用❓ 常见问题排查Q1修改模板后页面没有变化开启watch: true或调用clearCache(模板名)手动失效缓存。Q2报错 Failed to load template xxx检查root路径是否正确、ext扩展名是否与文件后缀一致模板名可不带扩展名会自动补上。Q3渲染出错时如何定位ECT 抛出的错误信息会自动附带文件名和行号直接按提示定位即可。Q4客户端跨域加载模板失败使用compiler中间件时模板目录必须与页面同域否则浏览器会拦截请求。总结ECT 的 API 设计非常精简render负责渲染、compile负责编译、clearCache管理缓存、configure调整选项、compiler提供服务端编译中间件配合root、ext、cache、watch、open、close六个选项就能覆盖从开发调试到生产部署的全部场景。掌握这份 ECT API 参考你就能把它快速集成到自己的项目中。【免费下载链接】ectFastest JavaScript template engine with embedded CoffeeScript syntax项目地址: https://gitcode.com/gh_mirrors/ect/ect创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考