From 3862160740129532b9a073068420b8550df719bf Mon Sep 17 00:00:00 2001 From: Wikiki Date: Wed, 7 Feb 2018 22:15:55 +0100 Subject: [PATCH] Integrate Gulp --- .gitignore | 1 + gulpfile.js | 126 +++++++++++++++++++++++++++++++++++++++++++++++++++ package.json | 29 +++++++++--- 3 files changed, 149 insertions(+), 7 deletions(-) create mode 100644 gulpfile.js diff --git a/.gitignore b/.gitignore index cd24a79..59598d4 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ /bulma +/node_modules diff --git a/gulpfile.js b/gulpfile.js new file mode 100644 index 0000000..e2eacda --- /dev/null +++ b/gulpfile.js @@ -0,0 +1,126 @@ +var gulp = require('gulp'); + +// Define variables. +var autoprefixer = require('autoprefixer'); +var babel = require('gulp-babel'); +var cleancss = require('gulp-clean-css'); +var concat = require('gulp-concat'); +var del = require('del'); +var gulp = require('gulp'); +var postcss = require('gulp-postcss'); +var runSequence = require('run-sequence'); +var sass = require('gulp-sass'); +var uglify = require('gulp-uglify'); + +/** + * ---------------------------------------- + * VARIABLES + * ---------------------------------------- + */ +var paths = { + src: 'src/', + dest: 'dist/', + bulma: 'node_modules/bulma/sass/utilities/', + jsPattern: '**/*.js' +} +var globalSassFile = 'bulma-steps.sass'; +var bulmaSassFile = '_all.sass'; +var mainSassFile = 'steps.sass'; +var distCssFile = 'bulma-steps.min.css'; +var mainJsFile = 'steps.js'; +var distJsFile = 'steps.min.js'; + +/** + * ---------------------------------------- + * STYLESHEETS + * ---------------------------------------- + */ + +// Uses Sass compiler to process styles, adds vendor prefixes, minifies, then +// outputs file to the appropriate location. +gulp.task('build:styles', ['build:styles:copy'], function() { + return gulp.src([paths.bulma + bulmaSassFile, paths.src + mainSassFile]) + .pipe(concat(globalSassFile)) + .pipe(sass({ + style: 'compressed', + includePaths: [paths.bulma] + })) + .pipe(concat(distCssFile)) + .pipe(postcss([autoprefixer({browsers: ['last 2 versions']})])) + .pipe(cleancss()) + .pipe(gulp.dest(paths.dest)); +}); + +// Copy original sass file to dist +gulp.task('build:styles:copy', function() { + return gulp.src(paths.src + mainSassFile) + .pipe(gulp.dest(paths.dest)); +}); + +gulp.task('clean:styles', function(callback) { + del([ + paths.dest + mainSassFile, + paths.dest + distCssFile + ]); + callback(); +}); + +/** + * ---------------------------------------- + * JAVASCRIPT + * ---------------------------------------- + */ + +// Concatenates and uglifies global JS files and outputs result to the +// appropriate location. +gulp.task('build:scripts', ['build:scripts:copy'], function() { + return gulp + .src([paths.src + paths.jsPattern]) + .pipe(concat(distJsFile)) + .pipe(babel({ + "presets": [ + ["@babel/preset-env", { + "targets": { + "browsers": ["last 2 versions"] + } + }] + ] + })) + .pipe(uglify()) + .pipe(gulp.dest(paths.dest)); +}); + +// Copy original sripts file to dist +gulp.task('build:scripts:copy', function() { + return gulp.src(paths.src + mainJsFile) + .pipe(gulp.dest(paths.dest)); +}); + +gulp.task('clean:scripts', function(callback) { + del([ + paths.dest + mainJsFile, + paths.dest + distJsFile + ]); + callback(); +}); + +// Deletes the entire _site directory. +gulp.task('clean', ['clean:scripts', 'clean:styles']); + +/** + * ---------------------------------------- + * GLOBAL BUILD + * ---------------------------------------- + */ +gulp.task('build', function(callback) { + runSequence('clean', + ['build:scripts', 'build:styles'], + callback); +}); + +/** + * ---------------------------------------- + * DEFAULT TASK + * ---------------------------------------- + */ +gulp.task('default', ['build']); diff --git a/package.json b/package.json index 5db2c2f..b76aa0d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bulma-steps", - "version": "0.2.0", + "version": "0.2.1", "description": "Display steps for a process (like sign-up, or order, form), in different colors, sizes, and states ", "main": "steps.sass", "scripts": { @@ -24,15 +24,30 @@ "url": "https://github.com/Wikiki/bulma-steps/issues" }, "homepage": "https://github.com/Wikiki/bulma-steps#readme", + "scripts": { + "build": "gulp" + }, "devDependencies": { - "bulma": "^0.6.1" + "@babel/core": "^7.0.0-beta.39", + "@babel/preset-env": "^7.0.0-beta.39", + "babel-core": "^7.0.0-beta.3", + "bulma": "^0.6.2", + "del": "^3.0.0", + "gulp": "^3.9.1", + "gulp-autoprefixer": "^4.1.0", + "gulp-babel": "^7.0.1", + "gulp-clean-css": "^3.9.2", + "gulp-concat": "^2.6.1", + "gulp-postcss": "^7.0.1", + "gulp-sass": "^3.1.0", + "gulp-uglify": "^3.0.0", + "run-sequence": "^2.2.1" }, "files": [ - "steps.sass", - "bulma-steps.css", - "bulma-steps.min.css", - "steps.js", - "steps.min.js", + "dist/steps.sass", + "dist/bulma-steps.min.css", + "dist/steps.js", + "dist/steps.min.js", "LICENSE", "README.md" ]