Vue.js と他フレームワークの括弧 {{ }} が被ってしまうので Vue.js の設定を変更する

フロントエンドのフレームワークにてパラメータをテンプレートに出力する時などは
括弧を使って以下のような書き方をすることが多いと思う。

<h1>{{ user.name }}</h1>
{% if user.age >= 20 %}
		<p>せいじん</p>
{% endif %}

js のフレームワークと php などの言語のフレームワークを一緒に使う時、
括弧が被ってエラー起こすことがある。

そういう時はどちらかのフレームワークの括弧を違う表記に変えることで解決する。
ここでは Vue.js の括弧の表記を変更する。

サンプルコード

• {{ xxx }} を [[ xxx ]] に変更する
• #delimiters

<div id="test">
	[[ hello ]]
</div>


<script type="text/javascript">

	var app = new Vue({
		delimiters: ['[[', ']]'],
		el: '#test',
		data: {
			hello: 'world',
		},
		methods: {},
	})

</script>