現在、Node.js で Express.js を使用して提供される main.jade ファイルがあります。jade ファイルの先頭には、すべてのテンプレートがあります。ご理解いただけると思いますが、これはすぐに手に負えなくなりました。以下を使用して、Backbone.js からテンプレートを読み込みます。
template:_.template($("#phone-tmplt-taskRow").html())
私のアプリには、モバイル、タブレット、デスクトップの 3 つのバージョンがあります。テンプレートを整理する最善の方法は何だろうと考えていました。html ファイルの先頭に 30 個までのテンプレートをリストしたくありません。テンプレートを整理するにはどうすればよいですか? バージョンごとに1つずつ、何らかの方法で3つのファイルを用意したいと思います。バージョンによって node.js/express.js とは異なる URL を提供したくありません。
テンプレートをファイル (phone-tpl.html など) に分けて、すべてを /templates ディレクトリに配置できます。次に、AJAX を介してそれぞれを読み込むことができます。その場合、リクエスト数を最小限に抑えるために (メモリまたは localStorage に) キャッシュを用意することをお勧めします。
別のオプションは、RequireJS を使用することです。Addy Osmani がテキストの使用を提案しました! テンプレートを読み込むプラグイン。より洗練されたオプションが Alex Sexton によって提案されました。このオプションでは、テンプレートをテキストとしてロードせず、Javascript 関数としてプリコンパイルします (r.js で最適化すると、すべてのテンプレートがバンドルされるため、本番環境ではすべてのテンプレートが関数であり、サーバーに要求しません)。 ）。
リンク:
サーバー側とクライアント側のすべてにJadeテンプレートを使用することになりました。アンダースコア テンプレートはありません。私はhttp://projects.jga.me/clientjade/を使用しました。これは jade テンプレートを取得し、単一の js ファイルにプリコンパイルします。利点:
clientjade はファイルの変更を監視しません。そこで、それを処理するケーキタスクを作成しました。そのルートに行く場合は、私のケーキのタスクをチェックしてください - https://gist.github.com/4041281
それらをjsファイルに入れてrequirejsでロードすることができます。これにより、非常に読みやすいコードが生成され、domへの依存が減少します。
私は実際に jade.js の「インクルード」機能を使用して、必要なことを行いました。アプリのバージョンごとに 3 つの .jade ファイルがあり、それらすべてを main.jade に含めます。将来的にはプロジェクトにrequire.jsを使用することになると思いますので、eabaitのヒントに感謝します。