0

EE のテンプレート システムによって作成された余分な空白を取り除き、「よりきれいな」マークアップを生成する方法があるかどうか疑問に思っていました。

テンプレートを読みやすくしておくのが好きです。数年後に仕事に戻ることがよくあり、他の開発者の作業をフォローしたり、チームの一員として作業したりする必要がありますが、すべてがきちんとネストされていると簡単になります。

問題は、EE がすべてのタブと改行を保持することであり、多くの条件などがあると、醜いコードになります。たとえば、次のようになります。

<div class="
    event {if event_all_day}all_day{/if} 
    {if event_multi_day}multi_day{/if} 
    {if event_first_day}first_day{/if} 
    {if event_last_day}last_day{/if} 
    {if all_day_event_index_difference > 0}index_difference_{all_day_event_index_difference}{/if}
">
    {if event_multi_day} 
        <a href="{path='calendar_main/event'}/{event_id}/">{event_title}</a>
    {if:else}
        <a href="{path='calendar_main/event'}/{if edited_occurrence}{event_parent_id}{if:else}{event_id}{/if}/" title="{event_title}">{event_title}</a>
    {/if}
</div>

これにレンダリングします:

<div class="
                                         event all_day 
                                         multi_day 


                                                                               ">

                                         <a href="http://www.downtownmuncie.org/calendar_main/event/1832/">Minnetrista Glass Show</a>
                                                                       </div>

EE タグを囲むすべてのタブと改行は保持されるため、<div>との間に 1 マイルの空白ができ</div>ます。

性能的には、意味がありません。ファイルサイズの増加について議論がなされるかもしれませんが、それは無視できます。また、Firebug を使用してコードをナビゲートしようとすると、少し邪魔になります。

しかし、何よりも、それはだらしなく見えるだけです。

次のように、それに応じてテンプレートを調整することをお勧めします。

<div class="event {if event_all_day}all_day {/if}{if event_multi_day}multi_day {/if}{if event_first_day}first_day {/if}{if event_last_day}last_day {/if}{if all_day_event_index_difference > 0} index_difference_{all_day_event_index_difference}{/if}">
    {if event_multi_day}<a href="{path='calendar_main/event'}/{event_id}/">{event_title}</a>{if:else}<a href="{path='calendar_main/event'}/{if edited_occurrence}{event_parent_id}{if:else}{event_id}{/if}/" title="{event_title}">{event_title}</a>{/if}
</div>

それは本当に実行可能な解決策ではありません。適切なテンプレートと適切なコードのどちらかを選択する場合、私は前者を使用する必要があります。

両方を持つ方法はありますか?

タイ

4

4 に答える 4

2

2.4.0以降を使用している場合、EEtidy_templateのフックを使用する拡張機能があります。template_post_parse

https://github.com/sjelfull/sf.tidy_template.ee_addon

于 2012-08-16T18:32:50.443 に答える
0

JesseBunchによるEEのAutoMinにはHTML圧縮機能があります。HTMLTidyのようにインデントを美しくすることはできませんが、ファイルサイズを小さくするためにすべての空白を削除します。

于 2012-08-14T13:47:52.363 に答える
0

これはテストされていませんが、同様の状況で (EE かどうかは正直思い出せません)、サーバー側のコード内に空白を入れました。したがって:

<div class="event {if
    event_all_day}all_day {/if}{if
    event_multi_day}multi_day {/if}{if
    event_first_day}first_day {/if}{if
    event_last_day }last_day {/if}{if
    all_day_event_index_difference > 0}index_difference_{all_day_event_index_difference{/if}
">
    {if
        event_multi_day}<a href="{path='calendar_main/event'}/{event_id}/">{event_title}</a>
    {if:else
    }<a href="{path='calendar_main/event'}/{if edited_occurrence}{event_parent_id}{if:else
    }     {event_id}{/if}/" title="{event_title}">{event_title}</a>
    {/if}
</div>
于 2012-08-15T00:47:38.697 に答える
0

自動または手動のソリューションを探しているかどうかはわかりません。自動化されたものは何も知りませんが、もっと素晴らしい人がそれを手伝ってくれると確信しています。私はマニュアルのファンなので、EE テンプレートで「本物の」エディターを使用し、It's All Text in FF を使用して、これらのテキスト領域とエディターを接続します。その時点で、哲学が指示する空白のルールをテンプレートに課すことができます。

于 2012-08-14T11:17:42.660 に答える