Skip to content

Instantly share code, notes, and snippets.

@awinogradov
Created April 7, 2014 09:26
Show Gist options
  • Save awinogradov/10017229 to your computer and use it in GitHub Desktop.
Save awinogradov/10017229 to your computer and use it in GitHub Desktop.
bem-project distribution with Gulp
var pkg = require('./package.json'),
settings = pkg._settings,
bem = require('bem').api,
gulp = require('gulp'),
gif = require('gulp-if'),
csso = require('gulp-csso'),
uglify = require('gulp-uglify'),
rename = require('gulp-rename'),
replace = require('gulp-replace'),
path = require('path'),
join = path.join,
BUNDLE = 'index',
BUNDLES_PATH = join(settings.root, settings.bundles),
BUNDLE_DIR = join(BUNDLES_PATH, BUNDLE),
// .prefix.css is the css after autoprefixer updates, it works by magic node in make.js
BUNDLE_CSS = join(BUNDLE_DIR, '_' + BUNDLE + '.prefix.css'),
BUNDLE_JS = join(BUNDLE_DIR, '_' + BUNDLE + '.js'),
BUNDLE_HTML = join(BUNDLE_DIR, BUNDLE + '.html'),
PUBLIC_PATH = settings.public,
PUBLIC_CSS = join(PUBLIC_PATH, settings.styles.dest),
PUBLIC_JS = join(PUBLIC_PATH, settings.scripts.dest),
PUBLIC_IMG = join(PUBLIC_PATH, settings.images.dest),
VERSION = pkg.version;
gulp.task('bem', function() {
bem.make({ verbosity: 'error' }, {targets: BUNDLE_DIR});
});
gulp.task('csso', function() {
gulp.src(BUNDLE_CSS)
.pipe(csso())
.pipe(rename(settings.styles.filename))
.pipe(gulp.dest(PUBLIC_CSS));
});
gulp.task('uglify', function() {
gulp.src(BUNDLE_JS)
.pipe(uglify())
.pipe(rename(settings.scripts.filename))
.pipe(gulp.dest(PUBLIC_JS));
});
gulp.task('replace', function() {
gulp.src(BUNDLE_HTML)
.pipe(replace('_' + BUNDLE + '.prefix.css', join(settings.styles.dest, settings.styles.filename)))
.pipe(replace('_' + BUNDLE + '.js', join(settings.scripts.dest, settings.scripts.filename)))
.pipe(gulp.dest(PUBLIC_PATH));
});
gulp.task('dist', ['csso', 'uglify', 'replace']);
gulp.task('default', ['bem']);
{
"name": "project-name",
"version": "0.0.1",
"description": "Write some words about project-name",
"private": true,
"homepage": "https://github.com/verybigman/project-name",
"bugs": "https://github.com/verybigman/project-name/issues",
"author": {
"name": "verybigman",
"email": "winogradovaa@gmail.com",
"url": "https://github.com/verybigman"
},
"repository": {
"type": "git",
"url": "git://github.com/verybigman/project-name.git"
},
"_settings": {
"root": "app",
"blocks": "blocks",
"bundles": "bundles",
"libs": "bower_components",
"public": "public",
"scripts": {
"dest": "scripts",
"filename": "scripts.min.js"
},
"styles": {
"dest": "styles",
"filename": "styles.min.css"
},
"images": {
"dest": "images"
},
"dist": {
"dest": "dist",
"filename": "project-name"
}
},
"dependencies": {},
"devDependencies": {
"bem": "~0.7.6",
"bem-environ": "~1.3.1",
"borschik": "~0.4.2",
"bower-npm-install": "~0.5.2",
"bem-tools-autoprefixer": "0.0.2",
"bem-cli": "~1.0.1",
"gulp": "~3.6.0",
"gulp-if": "0.0.5",
"node-sass": "~0.8.4",
"gulp-csso": "~0.2.7",
"gulp-uglify": "~0.2.1",
"gulp-rename": "~1.2.0",
"gulp-replace": "~0.2.0"
},
"engines": {
"node": ">=0.8.0"
},
"license": "MIT"
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment