A gulp plugin to build the solar css framework
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
CONTRIBUTING.md gulp-kelp initial commit and README Apr 29, 2015
LICENSE
README.md
index.js
package.json

README.md

gulp-solar

A gulp plugin to build the solar css framework

This plugin builds the solar framework css and js. It follows the build process laid out in the solar build overview.

This plugin is currently a hack and is not finished. The goal is that this will return just a scss library bundle and a css file.

Install

Install with npm

npm install --save-dev gulp-solar

Example usage

This plugin was timeboxed and not fully finished. It is inefficient (running libraryBundle twice) and incomplete (does not parse the scss), but it still works.

JS compile is currently not supported.

var gulp = require('gulp');
var solar = require('gulp-solar');
var async = require('async');
var sass = require('gulp-sass');

gulp.task('solarCss', function(gulpCallback) {
  var solarExtensions = ['solar', 'solar-stellarorg'];
  var libraryBundleTmpDir = '.tmp/solar-library-bundle/';
  var cssBundleTmpDir = '.tmp/solar-css-bundle/';
  var distDir = 'dist/css';

  async.series([
    function(callback) {
      solar.libraryBundle(solarExtensions)
        .pipe(gulp.dest(libraryBundleTmpDir))
        .on('end', callback)
    },
    function(callback) {
      solar.cssBundle(solarExtensions)
        .pipe(gulp.dest(cssBundleTmpDir))
        .on('end', callback)
    },
    // waiting in between here is necessary
    function(callback) {
      gulp.src(cssBundleTmpDir + '/**/*.scss')
        .pipe(sass())
        .pipe(autoprefixer(config.autoprefixer))
        .pipe(gulp.dest(distDir))
        .on('end', callback)
    },
    function(callback) {
      gulp.src('widgets/**/*.scss')
        .pipe(sass({
          includePaths: [libraryBundleTmpDir]
        }))
        .pipe(concat('widgets.css'))
        .pipe(autoprefixer(config.autoprefixer))
        .pipe(gulp.dest(distDir))
        .on('end', callback)
    },
    function(callback) {
      gulp.src('app/**/*.scss')
        .pipe(sass({
          includePaths: [libraryBundleTmpDir]
        }))
        .pipe(concat('app.css'))
        .pipe(autoprefixer(config.autoprefixer))
        .pipe(gulp.dest(distDir))
        .on('end', callback)
    }, function(callback) {
      gulpCallback();
    }]
  );
});

API

This plugin implements the solar compile process laid out in the solar build overview.

solar.libraryBundle()

Returns a stream containing a _solar-library-bundle.scss that imports a few library files from library subfolders.

solar.cssBundle()

Returns a stream containing a solar-css-bundle.scss that can be compiled by sass into a css file.

options.extensions

Type: String or Array Default: []

Names of the solar extensions you are using. The order of the array will determine the order in which the extensions are built. You must also have these extensions in your package.json.

options.tmpDir

Type: String Default: .tmp/solar

Sets the directory in which the temporary css files are stored. This directory is used to store the input scss files since ruby sass