Hatena::ブログ(Diary)

komiyakの通り道 このページをアンテナに追加 RSSフィード

2017-04-24

Google App Engine と Go 言語で Handlebars.js を使う

Google App Engine と Go 言語の組み合わせでウェブアプリを構築している。
JSHTMLテンプレートエンジンとして、Handlebars.js を使おうとした所、
Handlerbars.js と 'html/template' ライブラリの記法が衝突してしまい、
うまいこと行かなかった。

<div>
  <p>{{.Something}}</p> <!-- ここは Go の html/template -->
</div>
<script id="template" type="text/x-handlebars-template">
    {{something}} <!-- ここは Handlebars.js -->
</script>

'html/template' と Handlerbars.js の '{{}}' 記法が衝突してしまうわけで、
うまい回避方法がないか探してみたが、
結果的に良い方法が見つからなかった。


この記事は 2017年4月24日 時点の内容のものです。

結局どうしたか

html/template を通すと、'{{}}' のパースがどうしても入ってしまう。

結局は、JS から HTML タグを埋め込む方式しか、お手軽な方法が見つからなかった。

javascript - include HTML code in js - Stack Overflow
http://stackoverflow.com/a/12216418

ただ、この方式は JSHTML タグのメンテナンス性が著しく低下する。
Handlebars.js で使う HTML ファイルを html/template を通さずに、
管理する方法を設計する必要があると思う。

検討1:'{{}}' を使わない HTML テンプレートエンジンを使う?


'{{}}' は、HTML テンプレートエンジンでは広く採用されていて、
使われていないものを探すのは難しそう。
見つけたとしても、他の部分で 'html/template' と相性問題がありそうなので、
諦めることにした。

検討2:'html/template' に 一部の パースを無視するようなオプションはないか?


<div>
  <p>{{.Something}}</p> <!-- ここは Go の html/template -->
</div>

{{ignore}} <!-- このタグの中は無視する -->
<script id="template" type="text/x-handlebars-template">
    {{something}} <!-- ここは Handlebars.js -->
</script>
{{/ignore}}

みたいなのあるかなー?と思ったけど、これはなさそうでした。

検証3:'html/template' と JavaScript HTML テンプレートエンジンのベストプラクティスは?


いい感じの実装をしている人を見つけられなかった。
これは、私がうまい方法を見つけたら、追って更新しようと思う。

はてなユーザーのみコメントできます。はてなへログインもしくは新規登録をおこなってください。

トラックバック - http://d.hatena.ne.jp/komiyak/20170424/1493044632