Question

我正在使用Webpack 2和ejs-template-loader我可以为我的页面获取数据但是我需要将一些数据部分传递给部分数据。

<% 
var data = htmlWebpackPlugin.options.data;
var carouselElement = data.carouselElement;
if (data) {  %>
<!-- Header -->
<%- include ../../components/avalon/header/header.ejs %>
    <div class="page-mask">
        <div class="main-content <%= carouselElement%>">
            <%- include ../../components/hero.image/hero.image.ejs %>
            <%- include ../../components/content.carousel/content.carousel.ejs {carouselElement} %>
            <%- include ../../components/experiences/experiences.ejs %>
        </div>
    </div>
<%}%>

上面的代码给了我这样的错误

ENOENT：没有这样的文件或目录

您知道如何将数据传递给partials吗？

Answer 1

使用include传递EJS中部分数据：

<%- include( '../mypage', { data: "mydata" }); %>

在mypage.ejs

中显示

<%= data %> // will show mydata

使用EJS加载器，它似乎是这样的：

var mainPage = require("ejs!./mainPage.ejs");
var subPage = require("ejs!./subPage.ejs");

var renderedPage = _.mainPage('<%= mainPage %>', { title: 'data', subPage:subPage  });

<%= renderedPage %>

在mainPage.ejs：

<main>
    <h1><%= title %></h1>
    <%= subPage({ title:'sub page', content: 'This is the subPage' }) %>
</main>

在subPage.ejs：

<div>
    <h2><%= title %></h2>
    <p><%= content %></p>
</div>

不要忘记在你的webpack配置文件中添加lodash插件：

plugins: [
    new webpack.ProvidePlugin({
        _: "underscore"
    })
]

享受！

使用Webpack 2将数据传递给ejs partials

1 个答案: