Реализация Highlight.js в TextArea

У меня есть приложение Django, в котором в настоящее время есть несколько инструментов, которые пользователь может опробовать. Я сделал реализацию TextFSM, и способ, которым она устроена, заключается в создании TextArea form, где пользователь может ввести свой код, а затем он выведет результат. Форма выглядит следующим образом:


class TextFsmForm(forms.Form):
    """Form for the TextFsmParserView"""

    textfsm_template = forms.CharField(
        widget=CodeTextarea(
            attrs={
                "class": "p-3 form-control bg-transparent resizeable",
                "placeholder": "TextFSM Template",
            }
        ),
        label="TextFSM Template",
        required=True,
    )
    raw_text = forms.CharField(
        widget=CodeTextarea(
            attrs={
                "class": "p-3 form-control bg-transparent resizeable",
                "placeholder": "Raw Text",
            }
        ),
        label="Raw Text",
        required=True,
    )

А html выглядит так:

        <div class="pe-2">
            <div class="mb-3 position-relative">
                <label class="mb-2 fs-5 display-4" for="{{ form.textfsm_template.id_for_label }}">{{form.textfsm_template.label}}</label>
                {{ form.textfsm_template }}
            </div>

            <div class="position-relative">
                <label class="mb-2 fs-5 display-4" for="{{ form.raw_text.id_for_label }}">{{form.raw_text.label}}</label>
                {{ form.raw_text }}
            </div>
        </div>

        <!-- Rendered output -->
        <div class="d-flex flex-column">
            <p class="fs-5 mb-2 display-4">Result</p>
            <div id="result" class="p-4 p-md-3 tool-output form-control">
             {% if output %}{{output}}{% elif error %}<span class="text-danger">{{error}}</span>{% endif %}
            </div>
        </div>

Теперь моя проблема заключается в том, что всякий раз, когда я пытаюсь использовать Highlight.js или Prism.js, единственное, что я получаю, - это изменение шрифта. Никакой колоризации или чего-либо еще.

Наиболее релевантный пост, который я смог найти, это здесь, но все равно это никак не помогает. Я хочу сделать его выделенным, как входы/выходы при использовании парсера this, например. Любая помощь приветствуется

Вернуться на верх