Pug文件渲染脚本报错：如何正确输出!{scripts}变量？

这个报错是因为Pug在解析!{scripts}时出现了语法识别异常，结合你的代码来看，可以从两个方面调整来解决：

1. 更换Pug的不转义插值写法 #

Pug里有两种实现不转义变量输出的方式，你当前用的!{variable}更适合嵌入在文本段落中，而当你把它作为单独一行使用时，改用!= variable的写法会更符合Pug的语法规范，也能避免解析错误。

修改你的index.pug中对应行的代码：

head
  meta(charset="utf-8")
  title #{title}
  script(src="/jquery.js")
  link(rel="stylesheet", type="text/css", href="/styles.css")
  != scripts  <!-- 把!{scripts}换成这行 -->
  style.
    body {
      margin: 0;
    }
    /* safari 9 modals fix */
    .no-scroll {
      overflow: hidden;
      height: 100%;
    }

2. 修正scripts变量的内容（可选但重要） #

看你当前的Node.js代码，scripts变量里用了HTML转义字符（<、>），如果你的目标是在页面中输出可执行的<script>标签，那这些转义字符是多余的——因为!{...}或!=本身就是不转义输出，转义后的字符会被直接渲染成文本（比如页面上会显示<script...>而不是真正的脚本标签）。

把Node.js里的scripts变量改成原始的HTML字符串：

var html = pug.renderFile('./index.pug', {
  scripts: '<script type="text/javascript">console.log("Hello World!");</script>',
  title: 'test',
});

做完这两个调整后，Pug就能正确解析并输出你想要的脚本内容，不会再出现语法报错了。

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