Skip to content

Instantly share code, notes, and snippets.

@Nemo64
Last active September 25, 2016 22:13
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Nemo64/6df9b25c489686b70fc55880e1578355 to your computer and use it in GitHub Desktop.
Save Nemo64/6df9b25c489686b70fc55880e1578355 to your computer and use it in GitHub Desktop.
Gulp File for simple js project
var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var deployPath = 'dist';
gulp.task('default', ['build']);
gulp.task('build', ['js', 'css']);
gulp.task('watch', function () {
gulp.watch(['src/**'], ['js']);
gulp.watch(['less/**'], ['css']);
});
gulp.task('serve', ['build', 'watch'], function () {
var modRewrite = require('connect-modrewrite');
var header = require('connect-header');
browserSync.init({
open: false,
https: false,
server: {
baseDir: deployPath,
middleware: [
modRewrite([
// rewrite eg. "index" to "index.html"
'^(.*)/([^\.\/]+)$ $1/$2.html'
]),
header({
// these should be the same in the _headers file
'X-UA-Compatible': 'IE=Edge',
'X-XSS-Protection': '1; mode=block'
})
]
}
});
});
gulp.task('js', function () {
var browserify = require('browserify');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var uglify = require('gulp-uglify');
var sourcemaps = require('gulp-sourcemaps');
var gutil = require('gulp-util');
return browserify({entries: 'src/main.js', debug: true})
.transform("babelify", {presets: ["es2015"]})
.transform("ractivate")
.transform("require-globify")
.bundle()
.pipe(source('app.js'))
.pipe(buffer())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify())
.on('error', gutil.log)
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest(deployPath))
.pipe(browserSync.stream())
});
gulp.task('css', function () {
var sourcemaps = require('gulp-sourcemaps');
var concat = require('gulp-concat');
var less = require('gulp-less');
var autoprefixer = require('gulp-autoprefixer');
var clean = require('gulp-clean-css');
return gulp.src(['less/**.less'])
.pipe(sourcemaps.init())
.pipe(less({paths: ['.', 'less']}))
.pipe(concat('app.css'))
.pipe(autoprefixer({browsers: ['> 0.2% in DE', 'last 2 versions', 'Firefox ESR', 'not IE <= 11']}))
//.pipe(clean())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest(deployPath))
.pipe(browserSync.stream())
});
{
"name": "project-name",
"version": "1.0.0",
"description": "",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"devDependencies": {
"babel-preset-es2015": "^6.14.0",
"babelify": "^7.3.0",
"browser-sync": "^2.15.0",
"browserify": "^13.1.0",
"connect-header": "0.0.5",
"connect-modrewrite": "^0.9.0",
"gulp": "^3.9.1",
"gulp-autoprefixer": "^3.1.1",
"gulp-clean-css": "^2.0.12",
"gulp-concat": "^2.6.0",
"gulp-less": "^3.1.0",
"gulp-sourcemaps": "^1.6.0",
"gulp-uglify": "^2.0.0",
"ractivate": "^0.2.0",
"require-globify": "^1.4.1",
"vinyl-buffer": "^1.0.0",
"vinyl-source-stream": "^1.1.0"
},
"dependencies": {
"normalize.css": "^4.2.0"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment