根据pug-html-loader的自述文件,加载程序接受一个 data
对象,该对象作为 options
的一部分传递给模板。虽然在 pug API reference 中的 options
上不可用,我发现的一个 grunt 插件 ( grunt-contrib-pug ) 以相同的方式使用 API。
我为加载程序指定了以下选项:
loader: 'pug-html-loader',
options: {
pretty: true,
exports: false,
debug: !env.production,
compileDebug: !env.production,
cache: config.build.useCaching,
doctype: 'html',
data: {
title: config.metadata.title,
baseUrl: config.build.baseUrl,
server: env.server,
metadata: config.metadata
}
}
根据this question,我想通过以下方式访问:
title= data.title
但是,我在编译的时候总是遇到如下错误:
ERROR in Error: Child compilation failed:
Module build failed: TypeError: Cannot read property 'title' of undefined
出于调试目的,我在模板中包含了以下行:
-
console.log(' DATA! ' + data);
结果是:
DATA! undefined
我还通过声明一些乱码而不是对象(例如字符串、纯 json、数字......)来确保数据正确传递给哈巴狗,然后哈巴狗编译器提示数据不在有效格式等
有人遇到同样的问题吗?
最佳答案
您应该直接引用数据(即不要在字段前加上data
前缀)
所以你应该像这样改变你的代码:
{
loader: 'pug-html-loader',
options: {
data: {
title: 'Hello World'
}
}
}
然后从您的 PUG 模板中引用它已更新
doctype html
html
head
title= title
关于javascript - 使用 pug-html-loader 将数据传递给哈巴狗(无法读取未定义的属性),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44279144/