javascript – Mixing the syntax of two templating engines


There was such a problem, there is a Django application. I partly wanted to start rewriting the front in Vue, but there was a problem with the same syntax of template engines. {{value}} is used in both frameworks and it seems that I found a solution to a similar problem somewhere, but unfortunately I could not find it again. Vue for the first time stretches from the CDN, so doing SPA is not an option yet.


There are two ways to solve this problem.

  1. On the Django side: Use in templates instead of {{ some_varibale }} monstrous construction {% templatetag openvariable %} some_varibale {% templatetag closevariable %}
  2. Vue side: Override delimiters

     var app = Vue({ el: '#app', delimiters: ['[[', ']]'] });
Scroll to Top