Pug子父模板变量传递失败，meta标签未生效的排查方案求助

核心问题定位 #

你的代码中最关键的错误在于模板继承与block覆盖的逻辑错误：index.pug继承layout后，重复在block head中引入head.pug，并且错误地将子block嵌套在include语句内，导致Pug无法正确识别并填充head.pug中的动态内容。

排查解决步骤 #

1. 修正模板继承与block填充逻辑 #

layout.pug已经在block head中引入了head.pug，index.pug不需要重复引入，直接填充head.pug中定义的子block即可。重复引入会导致模板层级混乱，block无法被正确替换。

2. 验证变量作用域与插值语法 #

确保定义的变量（pageTitle、pageDescription等）处于head.pug能访问到的作用域中，要么放在index.pug的全局作用域，要么放在对应的子block内部，避免变量未定义导致插值失败。

3. 查看编译后的HTML输出 #

直接查看Pug编译生成的HTML文件，检查部分是否生成了对应的meta、title和canonical标签。如果编译后的HTML中没有这些内容，说明是模板语法或继承逻辑问题；如果有但浏览器看不到，再检查是否有其他代码（如JS）动态修改了head内容。

4. 检查Pug版本与编译配置 #

确认使用的Pug版本支持block继承和变量插值功能（Pug v2及以上版本均支持），同时编译时确保正确指定了pug目录作为模板根目录，避免路径解析错误导致head.pug未被正确加载。

修正后的代码 #

head.pug（移除多余的无效代码） #

meta(charset="UTF-8")
meta(name="viewport" content="width=device-width, initial-scale=1.0")
block title
  title #{pageTitle}
block description
  meta(name="description" content="#{pageDescription}")
block canonical
  link(rel="canonical" href="#{canonicalURL}")

layout.pug（保持原结构，无需修改） #

doctype HTML
html(lang="en")
  block head
    include head.pug
  body
    include navbar.pug
    block content
    include footer.pug

index.pug（修正继承与block填充逻辑） #

extends layout

// 全局定义页面变量，供head.pug插值使用
- var pageTitle = "My Website"
- var pageDescription = "This is my official website"
- var canonicalURL = "https://adityasutar.com/"

// 直接填充head.pug中的子block
block title
block description
block canonical

block content
  h1 Hello

或者也可以在子block内部定义变量（更灵活，适合不同页面单独配置）：

extends layout

block title
  - var pageTitle = "My Website"
  title #{pageTitle}
block description
  - var pageDescription = "This is my official website"
  meta(name="description" content="#{pageDescription}")
block canonical
  - var canonicalURL = "https://adityasutar.com/"
  link(rel="canonical" href="#{canonicalURL}")

block content
  h1 Hello

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