2014-12-18 13 views
10

Ich versuche, die Node-Sass-Middleware arbeiten mit Express. Die App läuft ohne Fehlernode-sass-middleware nicht compiling

...(modules) 
var sassMiddleware = require('node-sass-middleware'); 

var routes = require('./routes/index'); 

var app = express(); 

// uncomment after placing your favicon in /public 
//app.use(favicon(__dirname + '/public/favicon.ico')); 
app.use(logger('dev')); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: false })); 
app.use(cookieParser()); 
//---- LOAD SASS -----// 
// adding the sass middleware 
var srcPath = __dirname + '/scss'; 
var destPath = __dirname + '/public/stylesheets'; 
app.use(sassMiddleware({ 
    src: srcPath, 
    dest: destPath, 
    debug: true, 
    outputStyle: 'compressed' 
})); 

app.use(express.static(path.join(__dirname, 'public'))); 

jemand etwas falsch mit der Art und Weise sehen Kann ich versuchen, die sass zu kompilieren?

Dateistruktur:

app 
controllers 
routes 
public 
-stylesheets 
scss 
... 
+0

Welche Version von Express verwenden Sie? Im Beispiel verwenden die package.json connect 2.7.9. Die Konvention hat sich sehr verändert, so dass Sie so etwas wie app.use zu tun haben kann (sassMiddleware ({ src: srcpath, dest: destPath, debug: true, outputStyle: 'komprimiert' })()); – jusynth

Antwort

7

Dies ist, wie app.js sein sollte:

app.use(sassMiddleware({ 
    src: srcPath, 
    dest: destPath, 
    debug: true, 
    outputStyle: 'compressed' 
}), 
express.static(path.join(__dirname, 'public'))); 

Auch sollte Ihre Haupt SCSS Datei style.scss benannt werden und innerhalb SCSS/Sheets/Verzeichnis sein.

Sie sollten ein Protokoll so sehen, wenn Sie richtig das Modul geladen haben:

source : /Users/abc/Desktop/SO/SO_node/scss/stylesheets/style.scss 
    dest : /Users/abc/Desktop/SO/SO_node/public/stylesheets/stylesheets/style.css 
    read : /Users/abc/Desktop/SO/SO_node/public/stylesheets/stylesheets/style.css 
    render : /Users/abc/Desktop/SO/SO_node/scss/stylesheets/style.scss 
+0

Ihre Lösung funktionierte wie ein Zauber. Es ist ironisch, dass kein Beispiel für die korrekte Struktur von 'Node-Sass-Middleware'-Nutzung in fast nirgends vorhanden ist! Dies war das einzige Beispiel, das ich gefunden habe! –

+0

Das Hauptproblem ist der Pfad zur * .scss-Datei. Die doppelten Namen "scss/stylesheets /" – Volodymyr

0

besser gehen für grunt-sass. Einfache Konfiguration, automatisierte Aufgabe (dank Grunt) und auch schnellere Kompilierzeit wegen libsass, die die C-Version des ursprünglichen Ruby-Compilers für SASS ist. Kompilieren sass/SCSS Dateien in 0,3 Sekunden statt 3.

1

Ein Problem könnte auch sein, dass Sie scss

statt sass kompilieren wollen. Setzen Sie daher indentedSyntax auf false.

app.use(require('node-sass-middleware')({ 
    src: path.join(__dirname, 'scss'), 
    dest: path.join(__dirname, 'public'), 
    indentedSyntax : false, 
    sourceMap: true 
})); 

Oder entfernen Sie es vollständig. Express-Generator fügt diesen Wert standardmäßig hinzu.

Verwandte Themen