Flask项目问题：TemplateNotFound及模板继承失效

问题分析与修复方案 #

1. 解决jinja2.exceptions.TemplateNotFound: home.html异常 #

核心问题

你的文件结构不符合Flask的模板查找规则，模板文件必须放在templates目录下，但当前base.html和home.html直接存放在website根目录，而非website/templates文件夹内；同时代码中创建了蓝图但未注册到Flask应用，导致路由无法生效。

修复步骤

第一步：修正项目文件结构

调整为标准Flask项目结构：

main.py
website/
├── static/
├── templates/
│   ├── base.html
│   └── home.html
└── views.py

第二步：修复views.py代码

补充蓝图注册逻辑，同时简化模板路径配置（Flask会自动识别当前模块目录下的templates文件夹）：

from flask import Blueprint, Flask, render_template

app = Flask(__name__)

views = Blueprint('views', __name__)

@views.route('/')
def home():
    return render_template('home.html')

# 关键：将蓝图注册到Flask应用
app.register_blueprint(views)

if __name__ == '__main__':
    app.run(debug=True)

第三步：确认启动入口

main.py只需导入并启动应用即可：

from website.views import app

if __name__ == '__main__':
    app.run(debug=True)

2. 解决home.html无法正确继承base.html的问题 #

核心问题

base.html中缺少content块定义，导致子模板home.html里的{% block content %}内容无法被渲染插入；同时母版未预留head扩展块，子模板的自定义样式无法正确加载。

修复base.html代码

在对应位置添加块标记，替换原有静态文本：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>{% block title %}Congo Confort{% endblock %}</title>
  <style>
    /* Navbar styles */
    nav {
      background-color: purple;
      color: white;
      padding: 10px;
      display: flex;
      justify-content: space-between;
    }
    nav a {
      color: white;
      text-decoration: none;
      margin: 0 10px;
    }
    nav a:first-child {
      margin-left: 0;
    }
    /* Page styles */
    body {
      background-color: black;
      color: white;
      padding: 10px;
      margin: 0;
      padding-bottom: 60px; /* 给固定底部footer留出空间 */
    }
    /* Footer styles */
    footer {
      background-color: purple;
      color: white;
      padding: 10px;
      text-align: center;
      position: fixed;
      bottom: 0;
      width: 100%;
    }
    h1 {
      font-size: 48px;
      text-align: left;
      margin-left: 20px;
    }
  </style>
  {% block head %}{% endblock %} <!-- 新增head扩展块 -->
</head>
<body>
  <nav>
    <a href="/">Home</a>
    <a href="/about">About</a>
  </nav>
  <div class="container">
    {% block content %}{% endblock %} <!-- 替换静态文本为content块 -->
  </div>
  <footer>
    <p>&copy; 2023 Congo Confort. All rights reserved.</p>
  </footer>
</body>
</html>

验证

你的home.html代码逻辑本身无问题，完成上述修复后，子模板的content内容会自动替换母版对应块，head区域的自定义样式也会正常加载。

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