0

Harpでブログを運営しています。すべてが魅力のように機能しますが、達成できない (そして理解できない) ことが 1 つあります。プロジェクト全体で EJS を使用しています。問題は、生成されたソース (HTML) に余分な空白がたくさんあることです。メニューの場合のように減らそうとしましたが、うまくいきませんでした。

少なくとも改行を減らすことを期待しています。通常、私は次のようなものを使用します。

<li id="nav1" class="main-menu-li-current"><a class="menu-link-current" href="/">home</a></li><!--
    --><li id="nav2" class=""><a class="menu-link" href="/ebooks">ebooks</a></li><!--
    --><li id="nav3" class=""><a class="menu-link" href="/coding">coding</a></li><!--

しかし、問題は EJS によって動的に提供される部分にあり、これは機能せず、コードは醜く見えます:

      <div class="categories"><!--




           --><span class="category"><a class="category-link" href="/ebooks">ebooks</a></span>

それに対処する方法はありますか？縮小された LESS を使用する場合は、縮小された (または少なくとも合理的に見える) HTML も使用したいと思います。

コード例:

      <div class="categories"><!--
      <% var categories = public.articles._data[slug].categories %>
      <% if (categories !== undefined) { %>
         <% for (var i = 0; i < categories.length; i++) { %>
           <% if (categories[i] !== "vim tips") { %>
             --><span class="category"><a class="category-link" href="/<%= categories[i]  %>"><%= categories[i] %></a></span>
            <% } else { %>
             --><span class="category"><a class="category-link" href="/vim">vim tips</a></span>
            <% } %>
          <% } %>
        <% } %>
      </div>
4

2 に答える 2

0

これが問題だと思われる場合は、 EJS リポジトリでこれに関する既存の問題を検索する価値があるかもしれません。解決策は、ハープではなく、そこから得られる可能性があります。とはいえ、これを修正する 1 つの方法は、EJS で HTML コメントではなく JS コメントを使用することです。そのため、コメントはまったくコンパイルされません。

<% /* %>
  <h1>Commented out portion of my template</h1>
<% */ %>

ただし、あなたが配置したコメントはまったく必要ないと思います。動的 EJS は、コメントアウトした HTML を出力しないため、それらを完全に削除するのが最善の方法かもしれません。

<div class="categories">
  <% var categories = public.articles._data[slug].categories %>
  <% if (categories !== undefined) { %>
     <% for (var i = 0; i < categories.length; i++) { %>
       <span class="category"><a class="category-link" href="/<%= categories[i] === "vim tips" ? "vim" : categories[i] %>"><%= categories[i] %></a></span>
      <% } %>
    <% } %>
  <% } %>
</div>

お役に立てば幸いです。

于 2016-03-12T23:36:19.280 に答える