使用LESS編譯器應用程序時無法獲取initializr的HTML5 Boilerplate Bootstrap 2包以加載CSS

我已決定開始使用HTML5BP和Bootstrap2（以響應選項）作爲我未來項目的出發點，並認爲Initializr。 com的包生成器是讓這兩種產品正常工作的好方法。所以我下載了Initializr軟件包，選擇了樣板，Responsive Bootstrap 2，modernizr，回覆，jQuery開發，LESS和IE類選項。使用LESS編譯器應用程序時無法獲取initializr的HTML5 Boilerplate Bootstrap 2包以加載CSS

將壓縮包的內容放入乾淨的工作文件夾後，所有內容都按預期運行。並正確地打開index.html文件顯示預期的Bootstrap風格的「英雄」模板。這對於本地開發非常有用，但我希望能夠在本地編譯LESS文件並將適當的CSS文件上傳到我的服務器以獲取生產代碼。

輸入SimpLESS/LESS.app和我的第一個路障。

當使用SimpLESS/LESS.app，都應該從index.html的刪除以下兩行（如在該文件中的註釋）：

<link rel="stylesheet/less" href="less/style.less"> 
<script src="js/libs/less-1.2.1.min.js"></script>

，並與替換它們：

<link rel="stylesheet/less" href="less/style.css">

下面是index.html的實際評論：

<!-- Use SimpLESS (Win/Linux/Mac) or LESS.app (Mac) to compile your .less files 
to style.css, and replace the 2 lines above by this one: 

<link rel="stylesheet/less" href="less/style.css"> 
-->

這是我遇到的問題。即使SimpLESS正確編譯所有LESS文件，並將結果放入「style.css」文件中，「less」子目錄中，並且上面的行已被替換，Safari似乎不會加載樣式的CSS。

我做錯了什麼？

我也不應該正在生成一個腳本錯誤：

file://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js The requested URL was not found on this server.

但即使<script src="js/libs/less-1.2.1.min.js"></script>已被用於正確顯示的頁面出現錯誤。

編輯：我想這可能是有益的，如果我包括了index.html中的HTML :)

首先，用量少，在瀏覽器級別進行解釋，使用less.js（一切正常）：

<!doctype html> 
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]--> 
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]--> 
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]--> 
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]--> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 

    <title></title> 
    <meta name="description" content=""> 
    <meta name="author" content=""> 

    <meta name="viewport" content="width=device-width"> 

    <link rel="stylesheet/less" href="less/style.less"> 
    <script src="js/libs/less-1.2.1.min.js"></script> 

    <!-- Use SimpLESS (Win/Linux/Mac) or LESS.app (Mac) to compile your .less files 
    to style.css, and replace the 2 lines above by this one: 

    <link rel="stylesheet/less" href="less/style.css"> 
    --> 

    <script src="js/libs/modernizr-2.5.3-respond-1.1.0.min.js"></script> 
</head> 
<body> 
<!--[if lt IE 7]><p class=chromeframe>Your browser is <em>ancient!</em> <a href="http://browsehappy.com/">Upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to experience this site.</p><![endif]--> 

    <div class="navbar navbar-fixed-top"> 
..... basic template content removed to save space ........ 
    </div> 

    <div class="container"> 

..... basic template content removed to save space ........ 

    </div> <!-- /container --> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script> 
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.1.js"><\/script>')</script> 

<script src="js/libs/bootstrap/transition.js"></script> 
<script src="js/libs/bootstrap/collapse.js"></script> 

<script src="js/script.js"></script> 
</body> 
</html>

下一頁鏈接到LESS編譯「style.css文件」，永遠也不會被加載：

<!doctype html> 
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]--> 
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]--> 
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]--> 
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]--> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 

    <title></title> 
    <meta name="description" content=""> 
    <meta name="author" content=""> 

    <meta name="viewport" content="width=device-width"> 

    <link rel="stylesheet/less" href="less/style.css"> 

    <script src="js/libs/modernizr-2.5.3-respond-1.1.0.min.js"></script> 
</head> 
<body> 
<!--[if lt IE 7]><p class=chromeframe>Your browser is <em>ancient!</em> <a href="http://browsehappy.com/">Upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to experience this site.</p><![endif]--> 

    <div class="navbar navbar-fixed-top"> 
..... basic template content removed to save space ........ 
    </div> 

    <div class="container"> 
..... basic template content removed to save space ........ 
    </div> <!-- /container --> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script> 
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.1.js"><\/script>')</script> 

<script src="js/libs/bootstrap/transition.js"></script> 
<script src="js/libs/bootstrap/collapse.js"></script> 

<script src="js/script.js"></script> 
</body> 
</html>

UPDATE：找到了答案，將發佈它的時候計算器讓我:)

來源

2012-02-25 Gus Shortz

很確定這是鏈接到網址的樣板樣式，'

相關問題