[rails]erbとunderscore.jsを一緒に使ったらundefined local variables in templatesエラーが発生


erbのテンプレート内にunderscore.js用のテンプレートを記述していたら

undefined local variables in templates

のエラーになってしまいました。

デフォルトだと、erbもunderscoreも<%= xxx %>という記法のため衝突してしまったようです。

そこで、underscore.js側のテンプレート記法を<% ~ %>ではなく{{ ~ }}に変更することにしました。

# app/assets/javascripts/application.js

//= require underscore

_.templateSettings = {
  "interpolate": /\{\{=(.+?)\}\}/g,
  "escape": /\{\{-(.+?)\}\}/g,
  "evaluate": /\{\{(.+?)\}\}/g
};

を記述し、テンプレートを修正

# app/assets/javascripts/sample.js.coffee

<script type="text/template" id="sampleTemplate">
  <p>Hello {{= name }}</p>
</script>

これでテンプレート記法の衝突は回避出来ました。

ただ、if文とかを書くときの書き方が分かりづらくなりますね。。。

{{ if (1){ }}
<p>true</p>
{{ } }}

参考