web-dev-qa-db-fra.com

Comment installez-vous SASS avec Express?

Je crée une application node.js avec Express et socket.io. Je veux utiliser SASS et je vois qu'il y a un package npm pour cela, ce que je ne comprends pas, c'est comment faire le lien entre le nass SASS et l'application et le faire analyser le SASS?

MISE À JOUR: J'ai utilisé le middleware SASS https://github.com/andrew/node-sass l'a installé et l'a inclus de la manière suivante:

  sass = require('node-sass');


app.configure(function(){
  app.set('port', process.env.PORT || 3000);

  /* other stuff */

  sass.middleware({
    src: __dirname + '/public/stylesheets/sass',
    dest: __dirname + '/public/stylesheets',
    debug: true
  });
});

Mais ça ne marche toujours pas

node.jsexpresssass
23
ilyo

Vous devez utiliser le middleware sass, par exemple celui-ci .

Citant des documents:

var server = connect.createServer(
   sass.middleware({
       src: __dirname
       , dest: __dirname + '/public'
       , debug: true
    }),
   connect.static(__dirname + '/public')
);

en cas d'utilisation express, ajoutez simplement:

 app.use(
     sass.middleware({
         src: __dirname + '/sass', //where the sass files are 
         dest: __dirname + '/public', //where css should go
         debug: true // obvious
     })
 );

à votre appel app.configure().

Bien sûr, sur les systèmes de production, il est préférable de précompiler sass en CSS.

mise à jour

Dans l'exemple ci-dessus, le middleware recherchera les fichiers sass dans __dirname + '/sass/css'. Par défaut, il recherche également les fichiers avec l'extension .scss. Il ne semble pas y avoir d'option pour changer l'extension.

27
soulcheck

Si vous utilisez un générateur express, essayez

express --view=ejs --css=sass
10
Devendra Madheshiya

Voici une solution basée sur diverses sources dont les fils/commentaires ci-dessus:

noeud: 

var connect = require('connect');
var sass = require('node-sass');

var srcPath = __dirname + '/sass';
var destPath = __dirname + '/public/styles';

var server = connect.createServer(
    sass.middleware({
        src: srcPath,
        dest: destPath,
        debug: true,
        outputStyle: 'expanded',
        prefix: '/styles'
    }),
    connect.static(__dirname + '/public')
);

html: 

<!DOCTYPE html>
    <html>
    <head>
         <link rel="stylesheet" type="text/css" href="styles/main.css">
etc

système de fichiers:

rootDirectory/server.js (c'est l'application de noeud)

rootDirectory/public/styles/(c'est là que les fichiers scss compilés apparaîtront)

rootDirectory/sass/main.scss

Cela fonctionne pour moi et j'ai donné l'exemple à:

node-sass-example

ici:

node-sass-example using prefix

4
swervo

On dirait que l'implémentation a un peu changé pour Express. J'ai dû le faire à la place:

npm install node-sass-middleware --save

puis

var sass = require('node-sass-middleware');

 app.use(
     sass({
         src: __dirname + '/sass',    // Input SASS files
         dest: __dirname + '/public', // Output CSS
         debug: true                
     })
 );
2
Adam Grant