Reworking how styles are built and how SVG styles are included

This commit is contained in:
Jeff Avallone 2015-11-01 07:39:33 -05:00
parent fb4b39e75b
commit fdb79beb79
5 changed files with 32 additions and 13 deletions

1
.gitignore vendored
View File

@ -2,3 +2,4 @@ node_modules
.sass-cache .sass-cache
build build
docs docs
tmp

View File

@ -13,6 +13,7 @@ module.exports = {
helpers: './lib/helpers/**/*.js', helpers: './lib/helpers/**/*.js',
partials: './lib/partials/**/*.hbs', partials: './lib/partials/**/*.hbs',
sass: './src/**/*.scss', sass: './src/**/*.scss',
svg_sass: './src/sass/svg.scss',
js: ['./src/**/*.js', './src/**/*.peg'], js: ['./src/**/*.js', './src/**/*.peg'],
spec: './spec/**/*_spec.js' spec: './spec/**/*_spec.js'
}, },

View File

@ -10,8 +10,9 @@ gulp.task('default', ['server', 'docs'], function() {
config.globs.data, config.globs.data,
config.globs.helpers, config.globs.helpers,
config.globs.partials, config.globs.partials,
config.globs.sass config.globs.svg_sass
]), ['markup']); ]), ['markup']);
gulp.watch(config.globs.sass, ['styles']);
gulp.watch(config.globs.js, ['scripts', 'docs']); gulp.watch(config.globs.js, ['scripts', 'docs']);
}); });
@ -51,7 +52,7 @@ gulp.task('static', function() {
.pipe(gulp.dest(config.buildRoot)); .pipe(gulp.dest(config.buildRoot));
}); });
gulp.task('markup', ['styles'], function() { gulp.task('markup', ['markup:svg_styles'], function() {
var hb = require('gulp-hb'), var hb = require('gulp-hb'),
frontMatter = require('gulp-front-matter'), frontMatter = require('gulp-front-matter'),
rename = require('gulp-rename'); rename = require('gulp-rename');
@ -61,8 +62,14 @@ gulp.task('markup', ['styles'], function() {
.pipe(hb({ .pipe(hb({
data: config.globs.data, data: config.globs.data,
helpers: config.globs.helpers, helpers: config.globs.helpers,
partials: config.globs.partials, partials: _.flatten([
bustCache: true, config.globs.partials,
'./tmp/build/svg_styles.hbs'
]),
parsePartialName: function(file) {
return _.last(file.shortPath.split('/'));
},
bustCache: true
})) }))
.on('error', notify.onError()) .on('error', notify.onError())
.pipe(rename(function(path) { .pipe(rename(function(path) {
@ -71,12 +78,29 @@ gulp.task('markup', ['styles'], function() {
.pipe(gulp.dest(config.buildRoot)); .pipe(gulp.dest(config.buildRoot));
}); });
gulp.task('markup:svg_styles', function() {
var sass = require('gulp-sass'),
rename = require('gulp-rename');
return gulp.src('./src/sass/svg.scss')
.pipe(sass({
includePaths: require('node-bourbon').includePaths
}))
.on('error', notify.onError())
.pipe(rename(function(path) {
path.dirname = '';
path.basename = 'svg_styles';
path.extname = '.hbs';
}))
.pipe(gulp.dest('./tmp/build'))
});
gulp.task('styles', function() { gulp.task('styles', function() {
var sourcemaps = require('gulp-sourcemaps'), var sourcemaps = require('gulp-sourcemaps'),
sass = require('gulp-sass'), sass = require('gulp-sass'),
rename = require('gulp-rename'); rename = require('gulp-rename');
return gulp.src(config.globs.sass) return gulp.src('./src/sass/main.scss')
.pipe(sourcemaps.init()) .pipe(sourcemaps.init())
.pipe(sass({ .pipe(sass({
includePaths: require('node-bourbon').includePaths includePaths: require('node-bourbon').includePaths

View File

@ -1,7 +0,0 @@
var fs = require('fs'),
path = require('path'),
config = require('../../config');
module.exports = fs.readFileSync(config.buildPath('css/svg.css'), {
encoding: 'utf-8'
});

View File

@ -5,7 +5,7 @@
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
version="1.1"> version="1.1">
<defs> <defs>
<style type="text/css">{{svg_styles}}</style> <style type="text/css">{{> svg_styles}}</style>
</defs> </defs>
<metadata> <metadata>
<rdf:RDF> <rdf:RDF>