Harp 內(nèi)容

使用 Harp，你可以獲取到你的編譯文件的信息，除了源代碼文件的元數(shù)據(jù)。

有時(shí)你可能希望將變量分離開(kāi)來(lái)，或者說(shuō)將所有的全局?jǐn)?shù)據(jù)放在一個(gè)文件中并非有利。文件元數(shù)據(jù)來(lái)做這件事情是完美的。?_data.json? 文件比較特別，讓數(shù)據(jù)在模板中可用。

示例

也許你有一個(gè)全部是圖片的目錄，并且希望展示它們?nèi)?，你不需要為每一張圖片維持一個(gè)特別的元數(shù)據(jù)。

myproject/
  ├ index.jade
  └ images/
      ├ hello-world.jpg     <-- hello world image
      ├ hello-saturn.jpg    <-- hello saturn image
      └ hello-jupiter.jpg   <-- hello jupiter image

使用 EJS

現(xiàn)在，在 index.ejs 文件中，你可以遍歷 _contents 變量，引用每一個(gè)文件。

<% for(var i in public.images._contents){ %>
  <% var image = public.images._contents[i] %>
  <% if ( image.match(/\b.(jpg|bmp|jpeg|gif|png|tif)\b/gi) ) { %>
        <div>
            <img src="images/<%= image %>" />
        </div>
  <% } %>
<% } %>

這結(jié)果是如下的 HTML：

<img src="images/hello-world.jpg" />
<img src="images/hello-saturn.jpg" />
<img src="images/hello-jupiter.jpg" />

使用 Jade

現(xiàn)在，在 index.jade 文件中，你可以遍歷 _contents 變量，引用每個(gè)文件。

for image in public.images._contents
  img(src="images/#{ image }")

結(jié)果是下面的 HTML：

<img src="images/hello-world.jpg" />
<img src="images/hello-saturn.jpg" />
<img src="images/hello-jupiter.jpg" />