kompilieren weniger Datei zu Css in Expressjs 4.x

Question

Ich möchte die weniger Datei im Öffentlichen Ordner von Expressjs Anwendung kompilieren.

Abhängigkeiten, die ich verwende sind

"devDependencies": { 
    "ejs": "^2.3.1", 
    "express": "^4.10.6", 
    "mysql": "^2.5.4" 
    }, 
    "dependencies": { 
    "less": "^2.5.1", 
    "less-middleware": "^2.0.1" 
    } 

Inhalt in styles.less Datei

header { 
    background-image: url('../img/bg.png'); 
    height: 380px; 

    input#searchBox { 
     width: 100%; 
     height: 70px; 
    } 
} 

Server-Datei wie

var express = require('express'); // call express 
var app = express(); // define our app using express 
app.use(require('less-middleware')('public')); 
// Public folder 
app.use(express.static('public')); 

Je weniger Datei geändert unten sieht nicht beim Laufen es auf dem Server.

Remote Address:127.0.0.1:3000 
Request URL:http://localhost:3000/css/styles.less 
Request Method:GET 
Status Code:304 Not Modified 

Was ist der Fehler hier.

Verzeichnisstruktur:

Edit:

header { 
    background-image: url('../img/bg.png'); 
    height: 380px; 
    #cloud-tag span { 
     color: #fff; 
     font-weight: 800; 
     letter-spacing: 2px; 
    } 
    #cloud-tag_word_0 { 
     font-size: 100px !important; 
    } 
} 

Ich habe diese CSS in weniger Datei und es Browser wird ohne kompilierte in demselben Format gesendet.

Answer 1

Sie müssen die CSS-Datei anfordern, nicht weniger Datei in Ihrem Fall http://localhost:3000/css/styles.css nicht http://localhost:3000/css/styles.less. Die Middleware kompiliert die weniger Datei zu der von Ihnen angeforderten Datei.

Answer 2

Sieht aus wie die Art, wie Sie die Middleware zum Auslösen initiieren, das Problem sein könnte. Verwenden Sie "__dirname + '/ public'", um den Ordner anzugeben.