How can I render a JS template from a rendered HTML template?
<p>If I'd like to generate JavaScript code, and not just HTML, through Jinja2, am I stuck with keeping the JS code inline, or is there a way for me to reference the script?</p>

<p>Concretely:</p>

<p><strong>app.py</strong></p>

<pre><code>from flask import Flask, render_template
app = Flask(__name__)
app.config['DEBUG'] = True

@app.route('/')
def index():
    return render_template('index.html', name='Sebastian', color='pink')

if __name__ == '__main__':
    app.run()
</code></pre>

<p><strong>index.html</strong></p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta content="utf-8" http-equiv="encoding"&gt;
        &lt;script&gt;
            function myEnterFunction() {
                element = document.getElementById("demo");
                element.style.backgroundColor = "{{ color }}";
            }
        &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;p&gt;Hello {{ name }}&lt;/p&gt;
        &lt;div onmouseenter="myEnterFunction()"&gt;
            &lt;p&gt;onmouseenter:
                &lt;span id="demo"&gt;Mouse over me!&lt;/span&gt;
            &lt;/p&gt;
        &lt;/div&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>This works fine if the JavaScript code is inlined, but what if we'd like to remain tidy and reference a separate file?</p>

<pre><code>&lt;head&gt;
    &lt;meta content="utf-8" http-equiv="encoding"&gt;
    &lt;script src="code.js"&gt;&lt;/script&gt;
&lt;/head&gt;
</code></pre>

<p>?</p>

<p>Possibly, this can be done by replacing <code>src="code.js"</code> with</p>

<pre><code>{% render_template('code.js', color=color) %}
</code></pre>

<p>Can you see how to render a JS template while you're rendering an HTML template?</p>