1.1.0 • Published 7 months ago

node-sass-middleware v1.1.0

Weekly downloads
12,876
License
MIT
Repository
github
Last release
7 months ago

node-sass-middleware

Connect/Express middleware for node-sass.

Main CI Workflow npm version Gitter chat

Install

npm install node-sass-middleware

Usage

Recompile .scss or .sass files automatically for connect and express based http servers.

Connect example

const connect = require('connect')
const sassMiddleware = require('node-sass-middleware')
const server = connect.createServer(
  sassMiddleware({
      /* Options */
      src: __dirname
    , dest: __dirname + '/public'
    , debug: true
    , outputStyle: 'compressed'
    , prefix:  '/prefix'  // Where prefix is at <link rel="stylesheets" href="prefix/style.css"/>
  }),
  connect.static('/prefix', __dirname + '/public')
);

There is an example connect app here: https://github.com/andrew/node-sass-example

Heavily inspired by https://github.com/LearnBoost/stylus

Express example

const express = require('express');
const sassMiddleware = require('node-sass-middleware');
const path = require('path');
const app = express();
app.use(sassMiddleware({
    /* Options */
    src: __dirname,
    dest: path.join(__dirname, 'public'),
    debug: true,
    outputStyle: 'compressed',
    prefix:  '/prefix'  // Where prefix is at <link rel="stylesheets" href="prefix/style.css"/>
}));
// Note: you must place sass-middleware *before* `express.static` or else it will
// not work.
app.use('/public', express.static(path.join(__dirname, 'public')));

Connect with other middleware example

const connect = require('connect');
const sassMiddleware = require('node-sass-middleware');
const postcssMiddleware = require('postcss-middleware');
const autoprefixer = require('autoprefixer');
const path = require('path');
const http = require('http');
const app = connect();
const destPath = __dirname + '/public';
app.use(sassMiddleware({
    /* Options */
    src: __dirname
  , response: false
  , dest: destPath
  , outputStyle: 'extended'
}));
app.use(postcssMiddleware({
  plugins: [
    /* Plugins */
    autoprefixer({
      /* Options */
    })
  ],
  src: function(req) {
    return path.join(destPath, req.url);
  }
}));

http.createServer(app).listen(3000);

Options

  • src - (String) Source directory used to find .scss or .sass files.

Optional configurations

  • beepOnError - Enable beep on error, false by default.
  • debug - [true | false], false by default. Output debugging information.
  • dest - (String) Destination directory used to output .css files (when undefined defaults to src).
  • error - A function to be called when something goes wrong.
  • force - [true | false], false by default. Always re-compile.
  • indentedSyntax - [true | false], false by default. If true compiles files with the .sass extension instead of .scss in the src directory.
  • log - function(severity, key, val, message), used to log data instead of the default console.error. "severity" matches Winston severity levels.
  • maxAge - MaxAge to be passed in Cache-Control header.
  • prefix - (String) It will tell the sass middleware that any request file will always be prefixed with <prefix> and this prefix should be ignored.
  • response - [true | false], true by default. To write output directly to response instead of to a file.
  • root - (String) A base path for both source and destination directories.

    For full list of options from original node-sass project go here.

Express example with custom log function

const express = require('express');
const sassMiddleware = require('node-sass-middleware');
const path = require('path');
const winston = require('winston');
const app = express();
winston.level = 'debug';
app.use(sassMiddleware({
    /* Options */
    src: __dirname,
    dest: path.join(__dirname, 'public'),
    debug: true,
    log: function (severity, key, value) { winston.log(severity, 'node-sass-middleware   %s : %s', key, value); }
}));
// Note: you must place sass-middleware *before* `express.static` or else it will
// not work.
app.use(express.static(path.join(__dirname, 'public')));

Contributors

We <3 our contributors! A special thanks to all those who have clocked in some dev time on this project, we really appreciate your hard work. You can find a full list of those people here.

Building and Testing

git clone git@github.com:sass/node-sass-middleware
cd node-sass-middleware

npm install
npm test

Note on Patches/Pull Requests

  • Fork the project.
  • Make your feature addition or bug fix.
  • Add documentation if necessary.
  • Add tests for it. This is important so I don't break it in a future version unintentionally.
  • Send a pull request. Bonus points for topic branches.

Copyright

Copyright (c) 2013+ Andrew Nesbitt. See LICENSE for details.

nestjs-admin-example-appsomiibo-discord-bot-glitchlean-g-core-classeslean-g-loadercms-vision.jskavak-ts-express-generatorpicbombexpress.io.boilerplatetemporarilystairs@ntouba98/quicktools@yggdrasilts/coremc-discourse-sso@infinitebrahmanuniverse/nolb-node-sa@spinal/corealain-module-user@everything-registry/sub-chunk-2316nodetypednode-sass-koa-middlewarenode-sass-backendoh-hi-markdownmvcify@arc-hv/core@cornerstone-digital/switchly-express-middlewarebrigadehubbrigadehub-admin-c4sfbrigadehub-admin-gatewaybrigadehub-corebrigadehub-minibrigadehub-public-c4sfbrigadehub-public-c4sf-opensavannahcheeerschann_y.web.componentswawify@atomist/hackathon-starterzvonokarteryjsbc-test-design-systembeetlercocasusyggdrasil-archapi_tester_123annotatifyyejin.compyejin.componentsxuanhoanh.tech@telerik/kendo-common-taskscms-visioncollectio-cmscodenutleaderboard-jslean-universalladderjslg-wk20-bookstorelightsightmandorlamean-stack-nitrouskoa-scsskoa-sassnestjs-admin-apppretzel-assets-pipelineremote-videoreqlysad-ee-ufcgtacit-serverthunderstorm-idetovoltserveurserverbrickssocialadminspaceysoftware-testingtekos-adaptivecardsstaticbuildsite-builderservantvision-cjsacceleratedwonmin.web.componentsevno-frontenddo.web-compexpress-itcp-example-projectdy-genclient-managementgrunt-jquery-toolboxgrunt-angular-toolbox@myenai/plugin-server-expressgit-galleryexpressxdomoticz-heaters-expresscompagesdahye.componentsdahye.webcomponentsee6mdemoserver@rustam95/npm-testhack-uva-app@re-base/http-core@rajtastic/expressappharplite
1.1.0

7 months ago

1.0.1

2 years ago

1.0.0

2 years ago

0.11.0

7 years ago

0.10.1

7 years ago

0.10.0

7 years ago

0.9.9

7 years ago

0.9.8

8 years ago

0.9.7

9 years ago

0.9.6

9 years ago

0.9.5

9 years ago

0.9.0

9 years ago

0.8.0

9 years ago

0.7.0

9 years ago

0.6.0

9 years ago

0.5.0

9 years ago

0.4.0

10 years ago

0.3.1

10 years ago

0.3.0

10 years ago

0.2.0

10 years ago