Bootstrap渲染一个空白的白页 - 节点js- express - jade

Question

我正在尝试使用Jade模板引擎为Node.js启动引导程序。

当我尝试运行index.jade文件时，它只会呈现一个空白页面。

div.topbar
  div.fill
    div.container
      a.brand(href='#') #{title}
      ul.nav

      form.pull-right(method="post", id="loginForm")
        input.input-small(id="username", type="text", name="User", placeholder="Username")
        input.input-small(id="password", type="password", name="Password", placeholder="Password")
        input.btn.primary(type="submit", value="Sign In")
      p#loginPrompt.pull-right.login-prompt

当我运行时，我得到类似的东西。

但是当我尝试包含扩展布局（见下图）时，我定义了引导程序样式。 我得到一个空白页面。

任何人都可以向我解释如何设置此引导工作。 我在公共文件夹下的stylesheets文件夹中有bottstrap css文件，在公共文件夹下有javascripts下的js文件。

layout.jade

doctype
html
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/bootstrap.min.css')
    link(rel='stylesheet', href='/stylesheets/bootstrap-responsive.min.css')
    link(rel='stylesheet', href='/stylesheets/style.css')
    script(src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js')
    script(src='/javascripts/bootstrap.min.js')
  body
    block content

Answer 1

请确保包含block content，如下所示：

extends ./layout.jade
block content
    div.topbar
      div.fill
        div.container
          a.brand(href='#') #{title}
          ul.nav

          form.pull-right(method="post", id="loginForm")
            input.input-small(id="username", type="text", name="User", placeholder="Username")
            input.input-small(id="password", type="password", name="Password", placeholder="Password")
            input.btn.primary(type="submit", value="Sign In")
          p#loginPrompt.pull-right.login-prompt

我测试过这适用于你展示的layout.jade。

Answer 2

当您尝试引用您的玉器布局时出现简单错误。使用 extends./layout.jade 如果在这里不起作用，则会出现类似问题的链接Extending Jade Differently