Post and pre hooks for connect-assetmanager.
JavaScript
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
deps
lib
LICENSE
README.md
package.json

README.md

connect-assetmanager-handlers

Post and pre hooks for connect-assetmanager

Installation

Via npm:

$ npm install connect-assetmanager-handlers

Usage

var assetManager = require('connect-assetmanager');
var assetHandler = require('connect-assetmanager-handlers');
var assets = assetManager({
    'css': {
        'route': /\/static\/css\/[0-9]+\/.*\.css/
        , 'path': './public/css/'
        , 'dataType': 'css'
        , 'files': [
            'reset.css'
            , 'client.css'
        ]
        , 'preManipulate': {
            '^': [
                assetHandler.fixVendorPrefixes
                , assetHandler.fixGradients
                , assetHandler.replaceImageRefToBase64(root)
            ]
        }
    }
    'js': {
        'route': /\/static\/js\/[0-9]+\/.*\.js/
        , 'path': './public/js/'
        , 'dataType': 'javascript'
        , 'files': [
            'jquery.js'
            , 'jquery.client.js'
        ]
        , 'postManipulate': {
            '^': [
                assetHandler.uglifyJsOptimize
            ]
        }
    }
});

Handlers

uglifyJsOptimize

Uses UglifyJS to compress the give javascript files.

yuiJsOptimize

Uses YUI Compressor to compress the given javascript files.

yuiCssOptimize

Uses YUI Compressor to compress the given CSS files.

fixVendorPrefixes

Replaces -vendor with multiple versions of the same line for most vendor prefixes.

Example

-vendor-border-radius: 5px;

Turns into:

border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;

fixGradients

Enables easy use of top to bottom gradients cross browser.

Example��

gradient: rgba(255,255,255,1)_rgba(255,255,255,0.6);

Turns into:

background: rgba(255,255,255,1);
background: -webkit-gradient(linear,0% 0,0% 100%,from(rgba(255,255,255,1)),to(rgba(255,255,255,0.6)));
background: -moz-linear-gradient(top,rgba(255,255,255,1),rgba(255,255,255,0.6));
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffffff',EndColorStr='#99ffffff');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffffff', EndColorStr='#99ffffff')";

replaceImageRefToBase64

Looks for data-url(filepath/file.png) in the CSS and replaces those with the contents of the image, base64 encoded.

Setup

assetHandler.replaceImageRefToBase64(__dirname + '/public')

stripDataUrlsPrefix

Simply replaces data-url with url. Used as a complement with replaceImageRefToBase64 if you want to serve a css to IE6-7.

fixFloatDoubleMargin

Finds all blocks containing floats and add a display: inline; (unless there is another display set in that block) to fix double margin bugs.