2014-01-17 71 views
1

我對nodejs和bootstrap很陌生,但我很想構建一個簡單的個人網站,所以我有一些教程。無法加載bootstrap到nodejs

我下載bootstrap 2.0.2並解壓縮。

我把引導程序和引導程序響應到我的項目的樣式表文件夾,並將bootstrap.js和jquery.js放到我的項目的javascripts文件夾中。然後我按照指令更改index.jade和layout.jade爲如下:

**layout jade:** 
$<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
    <title><%= title %> - Microblog</title> 
    <link rel='stylesheet' href='/stylesheets/bootstrap.css' /> 
    <style type="text/css"> 
    body { 
    padding-top: 60px; 
    padding-bottom: 40px; 
    } 
    </style> 
    <link href="stylesheets/bootstrap-responsive.css" rel="stylesheet"> 
</head> 
</html>$ 


    **index.jade 
    <div class="hero-unit"> 
    <h1>歡迎來到 Microblog</h1> 
    <p>Microblog 是一個基於 Node.js 的微博系統。</p> 
    <p> 
    <a class="btn btn-primary btn-large" href="/login">登錄</a> 
    <a class="btn btn-large" href="/reg">立即註冊</a> 
    </p> 
    </div> 
    <div class="row"> 
    <div class="span4"> 
    <h2>Carbo 說</h2> 
    <p>東風破早梅 向暖一枝開 冰雪無人見 春從天上來</p> 
    </div> 
    <div class="span4"> 
    <h2>BYVoid 說</h2> 
    <p> 
    Open Chinese Convert(OpenCC)是一個開源的中文簡繁轉換項目, 
    致力於製作高質量的基於統計預料的簡繁轉換詞庫。 
    還提供函數庫(libopencc)、命令行簡繁轉換工具、人工校對工具、詞典生成程序、 
    在線轉換服務及圖形用戶界面。</p> 
    </div> 
    <div class="span4"> 
    <h2>佛振 說</h2> 
    <p>中州韻輸入法引擎/Rime Input Method Engine 取意歷史上通行的中州韻, 
    願寫就一部彙集音韻學智慧的輸入法經典之作。 
    項目網站設在 http://code.google.com/p/rimeime/ 
    創造應用價值是一方面,更要堅持對好技術的追求,希望能寫出靈動而易於擴展的代碼, 
    使其成爲一款個性十足的開源輸入法。</p> 
    </div> 
    </div>** 

然而,似乎佈局不只是如預期,任何人都可以告訴我什麼是錯誤的,因爲這是基本的一步,我剛剛stucked,不知道如何前進。謝謝!

回答

1
  1. 您的佈局和索引實際上並不符合Jade標記語言。
  2. 我沒有看到任何你在layout.jade或index.jade中鏈接jQuery.js和bootstrap.js的地方。

我期望像

!!! 5 
html 
    head 
    title #{meta.title} - #{meta.author} 
    link(rel="stylesheet", href="/twitter/bootstrap.css") 

    script(type="text/javascript", src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js")  
    script(type="text/javascript", src="/scripts/bootstrap.min.js") 
... 
0

嗯,你的HTML不是在玉語法 - 粘貼在這裏看到:http://html2jade.com

下面是一些文檔:http://jade-lang.com

如果你是剛開始接觸快遞有可包括其他模板Hogan內置(儘管在初始化新項目時必須指定)。 Hogan更像「html like」