Skip to content

jednano/postcss-middleware

Repository files navigation

postcss-middleware

 NPM version  npm license  Travis Build Status  AppVeyor Build Status

 npm

PostCSS middleware for Connect and Express frameworks.

Installation

 $ npm install postcss-middleware

Usage

JavaScript

 var  postcssMiddleware  =  require ( 'postcss-middleware' ) ;

TypeScript

 import  *  as  postcssMiddleware  from  'postcss-middleware' ;

Connect

 const  connect  =  require ( 'connect' ) ;
 const  app  =  connect ( ) ;
 app . use ( '/css' ,  postcssMiddleware ( /* options */ ) ) ;

Express

 const  express  =  require ( 'express' ) ;
 const  app  =  express ( ) ;
 app . use ( '/css' ,  postcssMiddleware ( /* options */ ) ) ;

Options

plugins

Type: Array Required: true

An array of PostCSS plugins .

options

Type: Object Required: false

PostCSS options such as syntax , parser or map .

 app . use ( postcssMiddleware ( {
	 plugins : [ /* plugins */ ] ,
	 options : {
		 parser : require ( 'sugarss' ) ,
		 map : {  inline : false  }
	 }
 }
 } ) ;

src

Type: (request) => string|string[] Required: false Default: req => path.join(__dirname, req.url)

A callback function that will be provided the Express app's request object. Use this object to build the file path to the source file(s) you wish to read. The callback can return a glob string or an array of glob strings . All files matched will be concatenated in the response .

 var  path  =  require ( 'path' ) ;
 app . use ( '/css' ,  postcssMiddleware ( {
	 src : function ( req )  {
		 return  path . join ( 'styles' ,  req . path ) ;
	 } ,
	 plugins : [ /* plugins */ ]
 } ) ;

The above example will match requests to /css . If /css/foo.css were requested, the middleware would read /styles/foo.css in the context of your application.

Using a regular expression route path , we can back-reference a capture group and use it as a folder name.

 var  path  =  require ( 'path' ) ;
 app . use ( / ^\/css\/([a-z-]+)\.css$ / ,  postcssMiddleware ( {
	 src : function ( req )  {
		 var  folder  =  req . params [ zero ] ;
		 return  path . join ( 'styles' ,  folder ,  '*.css' ) ;
	 } ,
	 plugins : [ /* plugins */ ]
 } ) ;

If you were to request /css/foo-bar.css in the above example, the middleware would concatenate all CSS files in the /styles/foo-bar folder in the response.

inlineSourcemaps

Type: Boolean Required: false Default: undefined

Generate inlined sourcemaps .

About

PostCSS middleware for Connect and Express frameworks.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published