Question

我正在使用gulp来构建我的项目，我的项目的一部分使用了Underscore模板。我在构建过程中使用的插件之一是gulp-template，它使用Lodash模板。

是否可以表示在使用gulp时应该呈现哪些代码，以及应该忽略哪些代码进行模板化？

例如，我有一个包含以下内容的文件：

<script src="<%= image_server_url %>/scripts/iep-alert/alert-content.js"></script>

在构建期间，我希望呈现image_server_url。但是，在我的项目的其他地方，我有这个代码，我想被gulp-template插件忽略：

<%
    if(alert.disability === "true") {
%>
    <li><span style="font-weight: bold;">Disability: </span><%= alert.disability %></li>
<%
    }
%>

现在，当我调用调用gulp-template的gulp任务时，我得到ReferenceError: alert is not defined，因为gulp-template的上下文不包含alert - 只有image_server_url是gulp-template的上下文的一部分。

编辑：我已编辑我的代码以匹配{{ image_server_url}}，我将调用更改为gulp-template，如下所示：

template({
    image_server_url: config.dev.image_server_url
}, {
    interpolate: /{{([\s\S]+?)}}/g
})

通过这些更改，当我运行build任务时，我认为gulp-template仍在尝试在<%和%>块中运行代码，因为我收到此错误：

window is not defined

它尝试在第一个<% JS block %>

内运行的代码

<%
    if (window.location.href.indexOf('admin') != -1) {
%>

如果有人能解决这个特殊问题，那很好。我想现在我将研究另一种解决方案。

Answer 1

我找不到理智的方法，因为你想要解析相同的模板两次，只有一些字符串必须在gulp中插入，其他字符串在浏览器。

建议使用_.templateSettings，以便在gulp处理中，您可以使用其他模板格式。

例如，gulp，你设置：

_.templateSettings.interpolate = /{{([\s\S]+?)}}/g;

在你的模板中：

<script src="{{ image_server_url }}/scripts/iep-alert/alert-content.js">

因此，当模板有意通过gulp处理时，请使用{{}}插值语法，当有意在浏览器端处理时，请使用默认（erb）<%= %>语法。 / p>

Answer 2

我最终使用了gulp-preprocess插件。我的代码现在看起来像这样，到目前为止它运作良好。

<script src="<!-- @echo IMAGE_SERVER_URL -->/scripts/iep-alert/alert.js"></script>