我该如何访问由gullow灰质插件创建的数据对象(当使用nunjucks编译html文件时）

How do I access the Data Object created by the gulp-gray-matter plugin (when compiling html files with nunjucks)

本文关键字：数据 对象 nunjucks 文件 html 编译 插件 何访问 访问 gullow 创建      更新时间：2024-01-26

我使用nunjucks render作为前端JavaScript模板引擎。

我想从某些.nunjuck文件中读取额叶物质数据，然后在将.nunjuk（模板）文件编译为.html文件时使用这些数据。

经过一点研究，我发现吞咽灰质是一种更快、更好的额叶提取插件。

我的问题是：我现在如何访问额叶物质数据对象？

例如，我会把.nunjucks文件中的正面内容写为：

---
title: Welcome to ACME Co.
---
<title>{{ data.title }}</title>

最终HTML输出应该是：

<title>Welcome to ACME Co.</title>

我的gulfile.js设置如下：

var gulp = require('gulp'),
    nunjucks = require('gulp-nunjucks-render')
    gulpGrayMatter = require('gulp-gray-matter');
    gulp.task("nunjucks", function(){
        return gulp.src(src/templates/**/*.+(nunjucks|njk))
            .pipe(gulpGrayMatter()) //send files through gray-matter plugin to extract frontal-matter
            .pipe(nunjucks({
                path: src/templates
            })) 
            .pipe(gulp.dest(src));
    });

默认情况下，gulp-gray-matter将所有前端数据存储在流中每个文件的data属性中。

此外，默认情况下，gulp-nunjucks-render使用流中每个文件的data属性中存在的数据。

所以你实际上不必在你的Gulpfile里做任何花哨的事情。这将起作用：

gulp.task('nunjucks', function(){
    return gulp.src('src/templates/**/*.nunjucks')
        .pipe(gulpGrayMatter())
        .pipe(nunjucks()) 
        .pipe(gulp.dest('dest'));
});

但是，您必须正确访问.nunjuck模板中的数据：

---
title: Welcome to ACME Co.
---
<title>{{ title }}</title>
相关文章：