javascript – Mixing the syntax of two templating engines

Question:

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.

Answer:

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