2012-02-07 12 views
22

Od Twitter Bootstrap 2 jest na zewnątrz, chciałem zintegrować to do mojego projektu Node.js. Niestety jest coś nie tak z mniej kompilatorem i nie mogę go uruchomić. Umieściłem wszystkie pliki w folderze publicznym i skonfigurowałem nowy projekt pod numerem express -c less newproj. i dodaje linie do mniejTwitter Bootstrap MNIEJ z Node.js i Express

less = require('less'); 
app.use(express.compiler({ src: __dirname + '/public', enable: ['less'] })); 

Wszystko mi mówi Node jest:

Express server listening on port 3000 in development mode 
undefined 

Po stronie klienta Dostaję 500 (wewnętrzny błąd serwera) dla pliku bootstrap.css, które powinny być opracowywane przez mniej.

lessc bootstrap.less 

Działa prawidłowo.

Ktoś wie, jak rozwiązać problem?

+0

Jakie inne middleware czy masz uruchomiony? statyczny? Czy wiesz, co rejestruje niezdefiniowane w konsoli? –

+0

Nic więcej. Jest to całkowicie nowy projekt i zmieniłem tylko te dwie linie i plik layout.jade. Nie wiadomo, skąd pochodzi "niezdefiniowany". – Patrick

Odpowiedz

19

dla potomności, to wiele się zmieniło w ostatnim Express:

app.use(require('less-middleware')({ src: __dirname + '/public' })); 
app.use(express.static(path.join(__dirname, 'public'))); 

// This is just boilerplate you should already have 
app.use(express.bodyParser()); 
app.use(express.methodOverride()); 
app.use(app.router); 
+0

Jaka to wersja? –

+0

ok, zainstalowałem mniej oprogramowania pośredniczącego. mój mniej plik (style.less) znajduje się w /public/stylesheets/styles.less - w jaki sposób mogę uzyskać styles.css? –

+0

@barraponto użyj href = '/ stylesheets/styles.css', a css jest automatycznie generowany – tofutim

11

Ok, oto co znalazłem dla ciebie. Najpierw potrzebujesz zarówno kompilatora, jak i statycznego oprogramowania pośredniego. Kompilator kompiluje swoje mniej i recompiles o zmianach, statyczne middleware robi rzeczywistego porcję css

app.use(express.compiler({ src : __dirname + '/public', enable: ['less']})); 
app.use(express.static(__dirname + '/public')); 

Po drugie, z jakiegoś powodu, gdy kompilator działa ona traci bieżące informacje o ścieżce, tak że nie może znaleźć obejmuje. Musiałem przejść przez bootstrap.css i dodać ścieżkę do każdego importu.

@import "/public/stylesheets/reset.less"; 

To jest wyraźnie dziwne, zamierzam zagłębić się w to dalej.

Edycja: Podczas gdy dziwne, głęboki przegląd kodu nie pokazuje mi prostego sposobu obejścia tego. Trochę więcej wyszukiwań znalazło to żądanie ściągnięcia na repozytorium connect https://github.com/senchalabs/connect/pull/174, które oferuje poprawkę na to, ale twórcy nie wydają się tego chcieć.

Istnieje również kilka obejść w tym wątku, ale wydaje się, że najlepszym pomysłem jest bezwzględna ścieżka zawiera.

+0

Zobacz rozwiązanie @ GoldenBoy do aktualizacji na ten temat. Powinieneś używać mniej-middleware. – tofutim