Vue and Django mustache templating conflict

Question

I am planning to do a project with Vue in the frontend and Django in the backend, but they both use double curly braces {{ }} as their template tags. Is there an easy way to change one of the two to use some other custom templating tag?

Thanks in advance.

Answer 1

Vue has a parameter called delimiters which set the placeholder's delimiters. For example this way you'll set them to double square brackets:

new Vue({
    delimiters: ['[[', ']]'],
    el: "#myapp",
    //...
})


<div>
   {{ djangoPlaceholder }}
   [[ vuePlaceholderValue ]]
</div>