node.js - Bootstrap渲染空白白页-node js-express-jade

Question

我正在尝试使用 Jade 模板引擎让 Node.js 的 Bootstrap 正常工作。

当我尝试运行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

当我运行这个时，我得到这样的东西。

但是当我尝试包含扩展布局(见下图)时，我定义了 Bootstrap 样式。我得到一个空白页。

任何人都可以解释一下如何设置此 Bootstrap 工作吗？我在 public 下的 stylesheets 文件夹中有 bottstrap css 文件，在 public 文件夹的 javascripts 下有 js 文件。

布局.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 内容，如下所示:

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。