Handlebars - 将Handlebars编译代码反编译为Handlebars模板

Question

是否有可能将Handlebars预编译的代码反编译为Handlebars模板？

例如，将以下内容转换：

function program2(depth0, data) { var buffer = '', stack1; data.buffer.push('<div '); ...... data.buffer.push('</div></div>'); return buffer; }

转换结果如下：

<div>{{name}}</div>

- Bhoomi

Answer 1

很遗憾，目前没有内置的方法可以这样做。

一个解决方案是编写一个函数来遍历已编译的代码，查找HTML被推送的位置，然后将该HTML重新组合起来（基本上是反向工程该函数）。

有一个缺点：编译模板使用depth0变量来存储从您的模型/对象传入的参数。您可以在每个已编译的模板被实例化的地方看到它和其他传入的对象作为参数。

App.Templates = function (Handlebars, depth0, helpers, partials, data) { ... }

所以您需要按照每个HTML元素的呈现方式，找到对应于推入stack变量的表达式的变量名。您需要获取用于添加模板中每个Handlebars块的属性的变量名称（例如：{{myData}}），以及使用的表达式（以及如果它是块表达式）。

假设我有一个简单的模板：

{{#if stuff}}
    <div id="General" class="content-section">
    <p>{{myData}}</p>
    </div>
{{/if}}

depth0对象包含stuff和myData。它们在模板内部如下使用(这不是一个可用的示例，我编辑了一个模板来展示它的样子):

buffer += "\r\n\r\n<div id=\"General\" class=\"content-section\">\r\n"
    + escapeExpression(((stack1 = ((stack1 = (depth0 && depth0.stuff)),
    stack1 == null || stack1 === false ? stack1 : stack1.myData)), 
    typeof stack1 === functionType ? stack1.apply(depth0) : stack1))

希望这能帮到你一点 - 如果你想付出努力，那么这肯定是可行的。

- code4coffee

---

您的答案看起来是继续前进的方式。谢谢！ - Bhoomi

@Bhoomi 如果你有兴趣在一个开源项目上合作完成这个任务，我非常乐意帮助组织。你可以在我的个人资料中找到我的联系方式。 - code4coffee