问题标签 [gulp-nunjucks-render]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1777 浏览

json - 使用 gulp 具有不同 JSON 数据的多个 Nunjucks 文件

我想使用 gulp 和 Nunjucks 一次生成多个具有不同内容的模板文件。这些模板都将具有完全相同的布局,但为文本/图像传递不同的变量。

我能够成功生成单个index.html文件,但不确定如何设置它以一次创建多个文件。这是我所拥有的简化版本:

gulpfile.js

布局.nunjucks

index.nunjucks

数据.json

更改此工作流程以生成多个文件且每个文件具有不同标题的最佳方法是什么?

我发现我可以创建多个index.nunjucks文件,但看起来它们都使用同一个data.json文件。我也不想为每个单独的 JSON 文件。

我可以在我的data.json文件中添加一个数组以让 Nunjucks 循环并为找到的每个对象创建一个单独的文件吗?如下所示:

数据.json

或者有没有办法在index.nunjucks文件中设置变量而不依赖于将它们存储在 JSON 中?

0 投票
1 回答
860 浏览

gulp - 循环 json,gulp-nunjucks-render 渲染具有相同内容的所有文件

我正在尝试使用 gulp-nunjucks-render 渲染 30 多个 html 页面。我创建了一个 nunjucks 模板和两个 json 文件(页眉和页脚的通用模板部分以及一组帖子数据)。“帖子”函数循环中的逻辑很简单:我获取所有帖子使用的一般信息,添加正确的帖子信息并将数据发送到将其呈现为 html 文件的函数。

我在我的“html”函数中使用 gulp-util 来注销用于渲染的数据,并且我看到数据是正确的(每个帖子都不同)。此外,文件名每次都应该不同。问题是渲染的html文件内容是一样的——最新渲染数据的内容。

我的 gulp 文件的相关部分:

我使用看起来像这样的 news.en.json 文件:

我得到了两个具有相同内容的文件(在这种情况下,“some title2”、“../img/7.jpg”、“some content2”... 在这两个文件中)。

当我想在每个 html 中获取不同的内容时,我做错了什么?gulp 或 nunjucks 是否有问题?

0 投票
0 回答
541 浏览

javascript - 使用 Gulp 检测多个源文件之间的更改

我遇到的最初问题是该任务运行了 x 次,因为其中存在的文件数量src.pages,我通过添加“就地更改”插件来修复这个问题,以比较源文件的最后修改日期。这意味着如果修改的日期没有改变,那么它就不会运行,或者如果它已经改变,那么它就会运行,但只是必要的次数。

因为插件只检查传递到流中的目录的文件,这意味着它不会检查里面的文件src.templates,这本质上是我的 .html 部分文件文件夹。我运行的解决方法是让单独的任务监视部分文件更改,但不运行任何比较功能,这意味着我仍然遇到任务运行多次的原始问题。

更新:这是我的 gulpfile 的精简版本,其中包含与我的问题相关的所有内容:

编辑澄清:我有一个任务监视页面和模板目录的更改,一旦完成,它就会运行该nunjucksPages功能。在 nunjucks 编译 HTML 后,浏览器同步将检测到这一点并注入 HTML(我的代码中的第二个监视任务)。

我目前的解决方法是复制两个 nunjucks 函数,并独立运行它们 - 具有缓存的页面功能(单次重新加载,问题已修复!),以及没有缓存的模板功能(每 X 数量的页面重新加载) .

相关问题和评论https ://github.com/carlosl/gulp-nunjucks-render/issues/47#issuecomment-240962074

0 投票
1 回答
558 浏览

gulp - gulp-nunjucks-render 需要大量时间来编译

我正在使用 gulp-nunjucks-render 进行 HTML 模板。

问题是,编译需要超过 3-4 分钟。即使我只有七个 nunjucks 模板。

这是编译完成后的样子 在此处输入图像描述

是否有任何 gulp 插件可以减少编译时间或仅编译那些更改的文件?

是 github repo,以防您需要查看完整的文件结构。

0 投票
1 回答
2064 浏览

templates - 如何在 Nunjucks 的页面模板中设置宏变量

我正在使用 Nunjucks 建立一个复杂的站点。我的文件夹结构是这样的:

我试图有一个宏(header-macro.njk),它会导致在当前页面的导航链接上设置活动类。它看起来像这样:

这将像这样导入到我的_header.njk部分中。

我想在每个页面模板中设置 nav.active 变量。所以在这种情况下,那将是dashboard.njk

但我得到一个错误:

错误:无法调用nav["active"],未定义或错误

但是,如果我在 _header.njk 中设置 nav.active('dashboard') 一切正常。

我是否缺少语法或文件夹结构的内容?

0 投票
2 回答
2178 浏览

nunjucks - 在 Nunjucks 模板中获取当前 URL?

似乎它应该很简单,但我很难找到答案。

如何在 Nunjucks 模板中找到当前页面的 URL?

这样的事情将是完美的:

0 投票
1 回答
2652 浏览

json - 如何添加 nunjucks-date-filter?

我不明白我应该把所有这些代码放在哪里, https://github.com/e-picas/nunjucks-date-filter 我有这个结构 在此处输入图像描述

这是我的模板

此时我有一个来自 Json 文件的日期格式,如 dd-mm-yyyy ,想用过滤器将其更改为 D-MMM。

0 投票
3 回答
369 浏览

json - 如何使用具有不同价值的 nunjucks groupby?

当我有这种值时,我无法弄清楚如何从 Json 中获取我的数据

我的模板

在输出中我有

我希望有

也许是因为起初我从 Json 获取了所有数据,然后我对它进行了分组,然后才使用我的 dateFilter ,但我怎么能以不同的方式支付它呢?

我的 gulpfile.js gulpfile

更新 19.12.18

示例输出

0 投票
3 回答
371 浏览

json - 我如何在 nunjuncks 中乘以数据?

例如

我想将价格乘以数量

来自 Json 文件的数据。

0 投票
3 回答
2045 浏览

json - Nunjucks 模板引擎中的动态标题和描述

我正在尝试了解Nunjucks模板的语言。

要生成 HTML,我使用 Gulp + 插件 gulp-nunjucks-render。

面临一个问题:我无法理解如何实现生成meta标签的title和description。

项目文件结构:

布局.njk

我连接到每个页面如下:

索引.njk

page1.njk

page2.njk

我在文档中找不到任何标题输出示例,所以我在这里看到的最有趣的方式。

例如,从文件 .JSON 中获取标题和描述

数据.json

gulpfile.js

我不知道如何从 json 中提取数据。请提出解决方案。