Skip to content

Instantly share code, notes, and snippets.

@alordiel
Last active March 12, 2020 11:30
Show Gist options
  • Save alordiel/cd1391885504c4e149da15dd351ea5d0 to your computer and use it in GitHub Desktop.
Save alordiel/cd1391885504c4e149da15dd351ea5d0 to your computer and use it in GitHub Desktop.
Starter Gulp (SASS and JS compiler, autoprefixer, babel, minifier)
'use strict';
const gulp = require( 'gulp' );
const sass = require( 'gulp-sass' );
const csso = require( 'gulp-csso' );
const concat = require( 'gulp-concat' );
const uglify = require( 'gulp-uglify');
const autoprefixer = require( 'gulp-autoprefixer' );
const notify = require( 'gulp-notify' );
const babel = require( 'gulp-babel' );
const del = require( 'del');
const path = {
SCSS_HOME_SRC: './home/scss/home.scss',
SCSS_HOME_WATCH: './home/scss/*.scss',
JS_HOME_SRC: './home/js/*.js'
};
// Clean assets
function clean() {
return del(["./dist/"]);
}
function jsCompile (){
return gulp
.src( [ path.JS_HOME_SRC ], { sourcemaps: true } )
.pipe(concat('home.min.js'))
.pipe(babel({
presets: ['@babel/env']
}))
.pipe( uglify() )
.pipe( gulp.dest( 'dist' ) )
.pipe( notify( "JS compiled successfully" ) );
}
function stylesCompile (){
return gulp
.src( path.SCSS_HOME_SRC, { sourcemaps: true } )
.pipe( sass().on( 'error', function ( err ) { return notify().write( err ); } ) )
.pipe( autoprefixer() )
.pipe( csso() )
.pipe( gulp.dest( 'dist' ) )
.pipe( notify( "SASS compiled successfully" ) );
}
function watchFiles () {
gulp.watch( path.SCSS_HOME_WATCH, stylesCompile );
gulp.watch( path.JS_HOME_SRC, jsCompile );
}
// Creating a default task
exports.watch = gulp.parallel(watchFiles);
exports.build = gulp.series(clean, gulp.parallel(stylesCompile, jsCompile) );
exports.default = gulp.parallel( jsCompile, stylesCompile );
{
"name": "gulp-script-compiler",
"version": "1.0.0",
"devDependencies": {
"@babel/core": "^7.8.7",
"@babel/preset-env": "^7.8.7",
"del": "^5.1.0",
"gulp": "^4.0.2",
"gulp-autoprefixer": "^7.0.1",
"gulp-babel": "^8.0.0",
"gulp-concat": "^2.6.1",
"gulp-csso": "^4.0.1",
"gulp-minify": "^3.1.0",
"gulp-notify": "^3.2.0",
"gulp-sass": "^4.0.2",
"gulp-uglify": "^3.0.2",
"gulp-watch": "^5.0.1"
},
"dependencies": {}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment