访问JavaScript文件时触发jinja2.exceptions.TemplateNotFound错误求助

核心错误：TemplateNotFound 问题原因及修复 #

你遇到的jinja2.exceptions.TemplateNotFound: {{ url_for('js', filename='taskTableDip.js') }}错误，根源在于HTML注释中的Jinja代码仍会被解析：
在supportDash.html中你注释掉的这一行：

<!--{% include "{{ url_for('js', filename='taskTableDip.js') }}" %}-->

Jinja模板引擎会优先解析所有{% ... %}标签，不管它是否被HTML注释包裹。这里{% include %}要求传入模板文件名，但你传入了Jinja表达式{{ url_for('js', filename='taskTableDip.js') }}，Jinja会把这个表达式的字面内容当成模板文件名去查找，自然找不到，抛出错误。

修复方法： #

彻底删除这行代码，或者使用Jinja的注释语法包裹（Jinja注释不会被解析）：

{# {% include "{{ url_for('js', filename='taskTableDip.js') }}" %} #}

其他代码问题修复 #

1. 修正JavaScript数据传递逻辑 #

你当前用dataReturn函数传递数据完全没必要，直接在HTML的<script>标签中赋值即可：
修改supportDash.html中的脚本部分：

<script type="text/javascript">
    // 直接将Flask传递的数据赋值给全局变量
    window.tableData = {{ tableData|tojson }};
</script>

这样JS文件中可以直接访问tableData变量，无需额外函数。

2. 修复taskTableDip.js中的语法与拼写错误 #

原JS文件存在多处错误：

• var table = 未完成赋值
• tablData 拼写错误（应为tableData）
• 循环中未将生成的行添加到表格中
• JS文件中使用{{ url_for }}无效（静态JS文件不会被Jinja解析）

修正后的taskTableDip.js：

// 页面加载完成后执行表格生成
document.addEventListener('DOMContentLoaded', function() {
    createTable();
});

function createTable() {
    const tableBody = document.getElementById('taskTable');
    // 清空现有内容
    tableBody.innerHTML = '';
    
    // 遍历数据生成行
    for (let i = 0; i < tableData.length; i++) {
        const task = tableData[i];
        // 注意：这里的Edit链接需要从HTML传递URL，因为JS文件不支持Jinja
        const row = `<tr>
            <td>${task[0]}</td>
            <td>${task[1]}</td>
            <td>${task[3]}</td>
            <td>${task[4]}</td>
            <td><a href="${window.editTaskUrl}">Edit</a></td>
            <td><button>处理</button></td>
            <td><button>关闭</button></td>
        </tr>`;
        tableBody.innerHTML += row;
    }
}

3. 传递编辑页面URL到JS #

在supportDash.html的脚本中添加编辑页面的URL：

<script type="text/javascript">
    window.tableData = {{ tableData|tojson }};
    // 传递Jinja生成的URL到全局变量
    window.editTaskUrl = "{{ url_for('editTask') }}";
</script>

注意：你需要在WebManager_main.py中添加editTask路由（如果还没有的话）：

@app.route("/edit-task")
def editTask():
    # 这里添加你的编辑页面逻辑
    return render_template("editTask.html")

验证文件结构 #

确认你的文件结构与代码匹配：

你的项目根目录/
├── WebManager_main.py
├── templates/
│   ├── base.html
│   ├── login.html
│   ├── supportDash.html
│   └── editTask.html
└── static/
    ├── css/
    │   └── main.css
    └── js/
        └── taskTableDip.js

启动应用的正确方式 #

修正WebManager_main.py中的启动代码（原代码注释有误）：

if __name__ == "__main__":
    app.run(port=8080, debug=True)

内容的提问来源于stack exchange，提问作者PyOrion