laravel-elixir-bundler/config.js

Creates separate, customizable, and versioned js and css asset bundles using laravel-elixir

/**
 * Generic callback used to hook into build
 * process while recipes are mixed
 *
 * @param  {Object}   mix        The laravel-elixir mixins
 * @param  {Object}   bundle     The bundle being mixed
 * @param  {String}   bundleName The name of the bundle
 * @param  {Elixir}   elix       The laravel-elixir object
 */
var cb = function (mix, bundle) {};

var config = {

    /**
     * Path to the node_modules relative to 'resources/assets/'
     * and the pattern to search for in elixir.json to replace
     *
     * @type {String}
     * @type {String}
     */
    nodePath: '../../../node_modules',
    nodeSearch: '{{node}}',

    /**
     * Path to the bower components relative to 'resources/assets/'
     * and the pattern to search for in elixir.json to replace
     *
     * @type {String}
     * @type {String}
     */
    bowerPath: '../../../bower_components',
    bowerSearch: '{{bower}}',

    /**
     * The recipes to run on each bundle.
     * Recipes will be executed in this order
     * @type {Array}
     */
    recipes: [
        'sass',
        'less',
        'css',
        'browserify',
        'babel',
        'js'
    ],

    /**
     * Map of mixins to compiled filetype
     *
     * @type {Object}
     */
    recipeMap: {
        sass: 'css',
        less: 'css',
        css: 'css',
        browserify: 'js',
        babel: 'js',
        js: 'js',
    },

    /**
     * @type {Function} before See above
     * @type {Function} after  See above
     */
    before: cb,
    after: cb,

    /**
     * The recipe configurations.
     *
     * @type {String} mixName The mixin name in the laravel-elixir module
     * @type {Function} put
     *       @param {Elixir} elix       The laravel-elixir object
     *       @param {String} bundleName The name of the bundle
     *              Overwrite this function to put the output in a different location
     *              or to change the filename. The ouput name will be the name of the
     *              bundle prefixed with the recipe. e.g The sass recipe for the bundle
     *              'main' would produce resources/assets/css/main.sass.css
     *              In this case, main.sass.css will also automatically be appended to
     *              the build files for css. (They are added according to recipeMap).
     *              If the compiled file needs to be in a different order in the build,
     *              then it must be set explicitly in the desired order
     *
     * @type {Function} before See above
     * @type {Function} after  See above
     */
    sass: {
        mixName: 'sass',
        put: function (elix, bundleName) {
            return elix.config.get('assets.css.outputFolder') + asCss(bundleName, 'sass');
        },
        before: cb,
        after: cb
    },
    less: {
        mixName: 'less',
        put: function (elix, bundleName) {
            return elix.config.get('assets.css.outputFolder') + asCss(bundleName, 'less');
        },
        before: cb,
        after: cb
    },
    css: {
        mixName: 'styles',
        put: function (elix, bundleName) {
            return elix.config.get('public.css.outputFolder') + asCss(bundleName);
        },
        before: cb,
        after: cb
    },
    browserify: {
        mixName: 'browserify',
        put: function (elix, bundleName) {
            return elix.config.get('assets.js.outputFolder') + asJs(bundleName, 'browserify');
        },
        before: cb,
        after: cb
    },
    babel: {
        mixName: 'babel',
        put: function (elix, bundleName) {
            return elix.config.get('assets.js.outputFolder') + asJs(bundleName, 'babel');
        },
        before: cb,
        after: cb
    },
    js: {
        mixName: 'scripts',
        put: function (elix, bundleName) {
            return elix.config.get('public.js.outputFolder') + asJs(bundleName);
        },
        before: cb,
        after: cb
    },

    /**
     * Asset configuration
     *
     * @type {Function} before See above
     * @type {Function} after  See above
     */
    assets: {
        before: cb,
        after: cb
    },

    /**
     * Version configuration.
     * Configure the options for building the versioned js and css
     *
     * NOTE: This should only be set on the 'every' bundle since laravel-elixir
     * rewrites the rev-manifest.json every time the 'version' mixin is
     * called. Therefore, the versioning has to be done in one go and can't
     * have custom bundle configuration for each versioning done. This
     * configuration will then be ignored for any bundle that is not the
     * 'every' bundle
     *
     * Also, the callbacks will also recieve the list of bundles being
     * versioned as their 'name' argument
     *
     *
     * @type {Function} put    See above
     * @type {Function} before See above
     * @type {Function} after  See above
     */
    version: {
        js: {
            put: function (elix, bundleName) {
                return elix.config.get('public.js.outputFolder') + asJs(bundleName);
            }
        },
        css: {
            put: function (elix, bundleName) {
                return elix.config.get('public.css.outputFolder') + asCss(bundleName);
            }
        },
        before: cb,
        after: cb
    }
};

/**
 * Searches path for node/bower prefix and replaces with
 * path to vendor package
 *
 * @param  {String} path
 * @return {String}
 */
config.pathReplace = function (path) {
    if (path.indexOf(config.nodeSearch) > -1) {
        return path.replace(config.nodeSearch, config.nodePath);
    }
    if (path.indexOf(config.bowerSearch) > -1) {
        return path.replace(config.bowerSearch, config.bowerPath);
    }

    return path;
};

/**
 * Append js file extension and prepend separator
 *
 * @param  {String} filename
 * @return {String}
 */
function asJs (filename, recipeType) {
    if (recipeType) {
        return '/' + filename + '.' + recipeType + '.js';
    }
    return '/' + filename + '.js';
}

/**
 * Append css file extension and prepend separator
 *
 * @param  {String} filename
 * @return {String}
 */
function asCss (filename, recipeType) {
    if (recipeType) {
        return '/' + filename + '.' + recipeType + '.css';
    }
    return '/' + filename + '.css';
}

module.exports = config;