Gulp build scripts for front end APC projects
Register gulp tasks based on a passed config object
Returns: Object
- registerWatchers function and array of registered task names
Param | Type | Default | Description |
---|---|---|---|
gulp | Object |
Gulp instance | |
config | Object |
Config Object | |
config.scssSrc | String |
Path of Sass files to lint and/or build | |
config.jsSrc | Array | String |
Path[s] of Js files to lint | |
config.jsEntry | Array | String |
Path[s] of Js files to build | |
config.pugSrc | Array | String |
Path[s] of pug files to lint | |
[config.scssIncludePaths] | Array |
[] |
SCSS include paths (for frameworks etc) |
config.jsDest | String |
Destination for Js built files | |
config.jsDestFilename | String |
Filename for built Js file | |
config.cssDest | String |
Destination for built CSS | |
config.jsSrc | Array | String |
Path[s] of Js files to lint | |
config.imgSrc | Array | String |
Path[s] for image files to be built | |
config.imgDest | String |
Destination for built image files | |
[config.showFileSizes] | Boolean |
true |
Show file sizes in console output? |
config.browserifyIgnore | Array |
Browserify paths to ignore |
Example
const gulp = require('gulp')
const register = require('apc-build').register(gulp, {
scssSrc: 'src/**\/*.scss',
scssIncludePaths: [],
cssDest: 'output/css',
showFileSizes: true
})
console.log(register)
// Returns
// {
// tasks: [ 'lint-sass', 'build-sass' ],
// registerWatchers: [Function: registerWatchers]
// }
Register watchers corresponding to the tasks already set up
Kind: method of [register
] return(#register)
Param | Type | Description |
---|---|---|
gulp | Object |
Gulp instance |
Example
const gulp = require('gulp')
const register = require('apc-build').register(gulp, config)
// Watchers corresponding to config values
// will be registered within watch task
gulp.task('watch', () => {
register.registerWatchers(gulp)
})
- build-img(gulp, path, dest) ⇒
function
Copy and compress images with imagemin
- build-js(gulp, entries, dest, [destFilename], [showFileSizes], [browserifyIgnore]) ⇒
function
Bundle and browserify front end JS files
- build-sass(gulp, path, dest, scssIncludePaths, showFileSizes) ⇒
function
Compile sass files
- lint-js(gulp, path) ⇒
function
Lint js files using eslint
- lint-pug(gulp, path) ⇒
function
Lint pug files using pug linter
- lint-sass(gulp, path) ⇒
function
Lint sass files using sass-lint
Copy and compress images with imagemin
Returns: function
- Gulp task
Param | Type | Description |
---|---|---|
gulp | Object |
Gulp instance |
path | Array | String |
Path[s] for image files to be built |
dest | String |
Output Destination |
Example
const gulp = require('gulp')
const tasks = require('apc-build')
gulp.task('build-img', tasks['build-img'](gulp, ['src/img/*'], 'dist/img'))
Bundle and browserify front end JS files
Returns: function
- Gulp task
Param | Type | Default | Description |
---|---|---|---|
gulp | Object |
Gulp instance | |
entries | String | Array |
Path[s] of Js files to build | |
dest | String |
Destination for Js built files | |
[destFilename] | String |
'bundle.js' |
Filename for built Js file |
[showFileSizes] | Boolean |
true |
Show file sizes in console output? |
[browserifyIgnore] | Array |
[] |
Browserify paths to ignore |
Example
const gulp = require('gulp')
const tasks = require('apc-build')
gulp.task('build-js', tasks['build-js'](gulp, ['src/js/entry.js'], 'dist/js', 'bundle.js'))
Compile sass files
Returns: function
- Gulp task
Param | Type | Description |
---|---|---|
gulp | Object |
Gulp instance |
path | Array | String |
Path of Sass files to build |
dest | String |
Destination for built CSS |
scssIncludePaths | Array |
Sass include paths (for frameworks etc) |
showFileSizes | Boolean |
Show file sizes in console output? |
Example
const gulp = require('gulp')
const tasks = require('apc-build')
gulp.task('build-sass', tasks['build-sass'](gulp, ['src/scss/*.scss'], 'dist/css', ['node_modules/foundation-sites/scss']))
Lint js files using eslint
Returns: function
- Gulp task
Param | Type | Description |
---|---|---|
gulp | Object |
Gulp instance |
path | Array | String |
Path[s] of Js files to lint |
Example
const gulp = require('gulp')
const tasks = require('apc-build')
gulp.task('lint-js', tasks['lint-js'](gulp, ['src/js/*']))
Lint pug files using pug linter
Returns: function
- Gulp task
Param | Type | Description |
---|---|---|
gulp | Object |
Gulp instance |
path | Array | String |
Path[s] of pug files to lint |
Example
const gulp = require('gulp')
const tasks = require('apc-build')
gulp.task('lint-pug', tasks['lint-pug'](gulp, ['app/views/*.pug']))
Lint sass files using sass-lint
Returns: function
- Gulp task
Param | Type | Description |
---|---|---|
gulp | Object |
Gulp instance |
path | String |
Path of Sass files to lint and/or build |
Example
const gulp = require('gulp')
const tasks = require('apc-build')
gulp.task('lint-sass', tasks['lint-sass'](gulp, 'src/scss/*'))
Test if object is an instance of gulp
Throws:
Error
Gulp instance not passed
Param | Type | Description |
---|---|---|
gulp | Object |
Gulp instance |