mj-gulp-workflow v2.3.4

A fork of zephir/zephir-gulp-workflow with added sourcemaps and other things.

differences to zephir-gulp-workflow:

changed functionality

• sourcemaps
• broswerify
• pngquant
• gulp cleanup for file removal (sourcemaps)
• gulp-notify
• favicons
• a lot of configuration has defaults
• jsand es6 are the same task, but can have different configurations (e.g. babel or no-babel)

conventions

• config files are located at the root of your package.json and are called gulp-config.js (not compileConfig.js as with zephir-gulp-workflow)
• sourcemaps are enabled for dev env by default
• pxToRem is removed
• es6 via babel and browserify are enabled for a specific task and source folder per default (babel-preset-env + browserstring)
• added imagemin options

Installation

1. Create a package.json in your project >> npm init
2. Install dependencies >> npm i --save-dev gulp mj-gulp-workflow
3. Create a new gulpfile.js and add the content you find below

require('mj-gulp-workflow')(require('gulp'));

First run

run gulp to create a gulp-config.js, configure to taste.

Configuration

tasks in combinedTasks are run in sequence, so if you want parallel execution you would have to put them in another array inside combinedTasks, e.g.:

combinedTasks: {
	dist: ["es6", "js", "images", "svg", "css", "copy", "clean"], // runs sequential
	default: [["dist", "watch"]], // runs parallel
},

a lot of configurable stuff has defaults, that can be overwritten. These defaults are not in the gulp-config to keep it clean. They can still be readded and overwrite the defaults. The defaults are:

css: {
	scss: {
		config: {
			outputStyle: 'compressed' 				}
	},

	sourcemaps: {
		enabled: 'dev'
	},

	autoprefixer: {
		enabled: true,
		config: {
			browserlist: ['> 0.1%']
		}
	},

	cleanCss: {
		enabled: true,
		config: {
			compatibility: 'ie8'
		}
	}
},
js: {
	sourcemaps: {
		enabled: 'dev'
	},
	browserify: {
		enabled: true
	},

	babeljs: {
		enabled: true,
		config: {
			minified: true,
			presets: [
				[
					'@babel/preset-env',
					{
						targets: {
							browsers: ['> 0.1%']
						}
					}
				]
			]
		}
	}
},
images: {
	imagemin: {
		enabled: true,
		config: [
			imagemin.gifsicle(),
			imagemin.jpegtran({ progressive: true }),
			imagemin.optipng({ optimizationLevel: 5 }),
			imagemin.svgo({ plugins: [{ removeViewBox: true }] })
		],
		additional: false
	}
},

svg: {
	svgmin: {
		enabled: true,
		config: {}
	}
}

The favicons-task has no defaults. Configuration looks like this:

favicons: {
	enabled: true,
	themeColor: '#cafe23',
	iconsPath: './',
	appName: 'FoobarBaz'
},

Usage

Run gulp dist --env dist for distribution, otherwise just gulp.

Dev

Dev server: npm run testd

Build with npm run babel-dist

Run tests witch npm test

Run test http server with npm run testd => http://localhost:8080, then look at the console.

@todo:

• fix sourcemaps using babel and browserify
• reintroduce a way to mark gulp-config.js files as outdated and show instructional messages after an update
• patch vulnerabilities brought by gulp-imagemin, rfg-api and cli-real-favicon by updating or replacing these dependencies

changelog

2.3.4

• Updated dependencies

2.3.1 - 2.3.3

• Updated dependencies
• npm audit fix

2.2.1

• created defaults for a lot of configuration to shrink down gulp-config.js

2.1.4

• Updated dependencies

2.1.2–2.1.3

• Updated dependencies + fix pngquant – thank you @hoffmannclaus!

2.1.0–2.1.1

• Added jsConcattask for easier vendor file concatenation

2.0.7–2.0.8

• Dependency updates, vulnerabilities and a small improvement to gif optimization

2.0.6

• Dependency updates, dependency updates and more dependency updates!
• As of now, everything is up to date and npm audit "found 0 vulnerabilities" 🎉

2.0.4–2.0.5

• add gulp-touch to modify dist files' mtime. See this issue over at gulpjs/gulp.

2.0.3

• fix an issue with non-existing source files and gulp.src()
• improved testing

2.0.2

• Port the watch task to gulp 4 *Whoopsie Daisies*

2.0.0–2.0.1

• Updated to gulp 4
• Remove unnecessary dependencies
• Patch many vulnerabilities

1.6.0

• update and clean up dependencies, including some major versions

1.5.0

• updated dependencies including major versions

1.4.2

• Fix installation issues

1.4.0–1.4.1

• Added favicon task using realfavicongenerator.net's CLI module

1.3.3

• updated dependencies including major versions

1.3.2

• updated dependencies

1.3.1

• fixed bug that made gulp process crash on first run

1.3.0

• move babel-transformation for es6 files to own source/task combo
• cleanup task is now clean

1.2.5

• improved task defaults, dev and dist as --env options, defaults to dev.
• updated dependencies

1.2.4

• remove config version check
• fix cleanup task for paths outside gulp directory
• fix babel when gulp task is in subdirectory
• add browserify (optional)

1.2.3

• add tests for copy and cleanup tasks
• code refactoring
• renamed compileConfig.js and defaultConfig.js
• remove pxToRem task

1.2.2

• merge changelog into README.md
• fix default config

1.2.1

• Fix run-sequence and cleanup task
• Filter junk files in task inclusion by glob and remove output dir before running gulp test

1.2.0

• added cleanup task for file removal (sourcemaps)
• added gulp-notify for errors
• replaced native gulp.watch with gulp-watch for better error handling

1.1.1

• cleanup, refactoring and overall code quality

1.1.0

• Moved testing to jest
• Run tests with npm test (run gulp dist first!)