Nodejs jade模板解析问题，异常解析，找不到问题。。。

Nodejs jade模板解析问题，异常解析，找不到问题。。。

layout.jade
enter code here doctype 5 html head meta(http-equiv=‘content-type’, content=‘text/html;charset=utf-8’) title #{title} link(rel=‘stylesheet’, href=’/stylesheets/style.css’) script(type=‘text/javascript’, src=’/javascripts/jquery-1.9.1.js’) block headscript body block content

reg.jade

enter code here

extends layout

block content form(method=‘post’) input(name=‘userName’,type=‘text’) input(name=‘passWord’,type=‘text’) input(type=‘submit’,value=‘提交’)

但是浏览器解析后的代码是

enter code here

<html> <head></head> <body> doctype 5 <meta http-equiv=“content-type” content=“text/html;charset=utf-8”> <title>用户注册</title> <link rel=“stylesheet” href="/stylesheets/style.css"> <script type=“text/javascript” src="/javascripts/jquery-1.9.1.js"></script> <form method=“post”><input name=“userName” type=“text”> <input name=“passWord” type=“text”><input type=“submit” value=“提交”> </form> </body> </html>

求指教。。。。


2 回复

根据你提供的信息，看起来你在使用Jade模板引擎时遇到了一些问题。Jade模板引擎现在已经被Pug所取代，但基本语法相似。从你提供的代码来看，问题可能在于Jade模板的语法错误或布局文件与子文件之间的引用问题。

首先，我们来检查一下layout.jade文件：

doctype 5
html
  head
    meta(http-equiv='content-type', content='text/html;charset=utf-8')
    title #{title}
    link(rel='stylesheet', href='/stylesheets/style.css')
    script(type='text/javascript', src='/javascripts/jquery-1.9.1.js')
    block headscript
  body
    block content

接下来，我们检查reg.jade文件：

extends layout

block content
  form(method='post')
    input(name='userName', type='text')
    input(name='passWord', type='text')
    input(type='submit', value='提交')

确保你的代码没有缩进错误或其他语法错误。在Jade/Pug中，正确的缩进是非常重要的。

如果你仍然遇到问题，可以尝试以下步骤：

  1. 检查变量传递：确保在渲染reg.jade模板时正确传递了title变量。例如，在Express中，你可以这样做：

    res.render('reg', { title: '用户注册' });

  2. 检查依赖项：确保你已经安装并正确配置了所有必要的依赖项，包括Jade/Pug模块。

  3. 查看错误信息：如果在运行时有错误信息，提供这些信息可以帮助更准确地诊断问题。

  4. 更新到Pug：由于Jade已被弃用，建议将项目迁移到Pug。你可以通过以下命令更新模板文件：

    npm install pug --save

    然后修改模板文件扩展名从.jade到.pug。

希望这些建议能帮助你解决问题！


从你提供的信息来看，问题可能出在Jade（现称为Pug）模板引擎的语法上。根据你描述的情况，浏览器中渲染出来的HTML代码没有正确地包含<html>、<head>和<body>标签中的内容，这通常是因为模板文件中的某些语法错误导致Jade未能正确解析。

解决方案

  1. 检查引号是否统一： 确保所有属性值使用一致的引号形式（单引号或双引号）。Jade对引号的敏感性可能导致解析错误。你可以尝试将所有的引号改为一致的形式，例如全部使用双引号。

  2. 验证布局文件（layout.jade）与内容文件（reg.jade）的继承关系： 确保在reg.jade文件中正确地使用了extends layout语句，并且在适当的位置插入了块（block）。

示例修正后的代码

layout.jade

doctype 5
html
  head
    meta(http-equiv='content-type', content='text/html;charset=utf-8')
    title #{title}
    link(rel='stylesheet', href='/stylesheets/style.css')
    script(type='text/javascript', src='/javascripts/jquery-1.9.1.js')
    block headscript
  body
    block content

reg.jade

extends layout

block content
  form(method='post')
    input(name='userName', type='text')
    input(name='passWord', type='text')
    input(type='submit', value='提交')

解释

通过确保模板文件中的引号一致性以及正确使用extends和block指令，可以解决大部分常见的Jade模板解析问题。如果你仍然遇到问题，请检查是否有其他潜在的语法错误，或者考虑更新你的Node.js环境和相关依赖包版本。

回到顶部