在沒有localhost /服務器，客戶端，瀏覽器的情況下使用Less

Question

我正在嘗試第一次使用引導程序，到目前為止，它可以正常工作。

但是我在需要較少的媒體查詢。 http://getbootstrap.com/css/#grid-media-queries

現在我在標題中有這個：

<link rel="stylesheet" type="text/css" href="css/custom.less">
<script type="text/javascript" src="js/less-1.7.4.min.js"></script>

這是較少的文件：

/* Small devices (tablets, 768px and up) */
@media (min-width: @screen-sm-min) { 
    background-color: red;
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: @screen-md-min) { 
    background-color: green;
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: @screen-lg-min) { 
    background-color: blue;
}

我收到以下錯誤：

Resource interpreted as Stylesheet but transferred with MIME type text/plain: "file:///Users/doekewartena/Downloads/bootstrap-3.2.0-dist/css/custom.less".

與此相關： LESS CSS變量不起作用

我在想什么。 不需要在服務器/本地主機上運行嗎？如果是，為什么呢？

我使用Chrome瀏覽器。

Answer 1

它可以用純JavaScript編寫（使用less.js）在客戶端/瀏覽器上運行。 閱讀有關客戶端使用的入門教程 。

從該頁面復制並粘貼代碼，因為您自己編寫它是危險的。

常見的錯誤是：

• 鏈接rel必須為rel="stylesheet/less"而不是 rel="stylesheet" ！
• 遵守加載順序，因為較少的JavaScript需要在運行之前加載.less樣式表文件才能處理它們！
• 當然，請確保文件路徑正確...

我建議使用最簡單的方案（一個變量，一個少文件）進行測試。