Estoy tratando de hacer que las llaves de Jinja se mantengan en línea para una variable de JavaScript utilizada en una llamada apexchart.js para una página HTML de matraz.

 labels = JSON.parse({{ labels | tojson}}) data = JSON.parse({{ data | tojson}})

El problema que tengo es que cuando guardo el html, las llaves se separan.

 labels = JSON.parse({ { labels | tojson } }) data = JSON.parse({ { data | tojson } })

¿Hay alguna forma de evitar que Visual Studio Code divida el código Jinja?

Código actual a continuación:

 <!-- language: lang-html --> <!-- templates/index.html --> {% extends 'base.html' %} {% block content %} <title>Dashboard | {{title}}</title> <div class="flex h-screen justify-center"> <div id="chart" class="h-1/4 w-1/2 content-center"></div> </div> <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script> <script> labels = JSON.parse({ { labels | tojson } }) data = JSON.parse({ { data | tojson } }) var options = { colors: ['#01ca95'], chart: { type: 'bar' }, dataLabels: { enabled: false }, series: [{ name: 'sales', data: data }], xaxis: { categories: labels }, yaxis: { labels: { formatter: function(data) { //Setup new Formatting class variable var Formatter = new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }); return Formatter.format(data); } } }, } var chart = new ApexCharts(document.querySelector("#chart"), options); chart.render(); </script> {% endblock content %}