We are being required to move all css and javascript to external files. The css works fine. The javascript files only works in a particular way which is not approved. The following line works:

    '''
    <script>{% include 'js/region_data.js' %}</script>
    '''

This line does NOT work: Gets the following error in the dev tools console, region_data.js:7 Uncaught SyntaxError: Unexpected token % (at region_data.js:7:6)

    '''
    <script src="/static/js/region/region_data.js" type="text/javascript"></script>
    '''

This is their location in the html file, the line that doesn't work is commented out:

    '''
    {% extends "layout_bs5.html" %}
    {% import 'macros.html' as data_macros %}
    {% block head %}
        {{ super() }}
        <link rel="stylesheet" type="text/css" href="/static/css/region/region_data.css">
        <script>{% include 'js/region_data.js' %}</script>
        <!-- <script src="/static/js/region/region_data.js" type="text/javascript"></script> -->
    {% endblock %}
    '''

The {% is where the error occurs when using the <script src=...

    '''
    $( document ).ready(function() {
      {% for parameter in parameters %}
          {{ data_macros.generate_js(parameter) }}
      {% endfor %}
    '''

folder structure for file that works:

    '''
    region_data/trunk/src/templates/js/region_data.js
    region_data/trunk/src/templates/index.html
    region_data/trunk/src/templates/macros.html
    '''

folder structure for file that does NOT work

    '''
    static/trunk/src/static/js/region/region_data.js
    '''

I have heard that anything to do with flask needs to be loaded with the flask templates and I can't use an external file in static if it has flask or jinja in it. Is that why the static file gets an error but the one in the templates/js folder does not??

I don't understand why.
I am not allowed to use the 'include'. It has to be in the static folder but I don't see a way of doing that. Any ideas?