Update to gulp-task-maker 2.0

Author: Florens Verschelde

.eslintrc

@@ -0,0 +1,8 @@
+{
+  "env": {
+    "es6": true,
+    "node": true
+  },
+  "extends": ["eslint:recommended", "prettier"],
+  "rules": {}
+}

.gitattributes

@@ -1,8 +1,8 @@
-# Archive downloads: only keep gulp-tasks, gulpfile.js, package.json
+# Archive downloads: only keep tasks, gulpfile.js, package.json
 /doc               export-ignore
 /test              export-ignore
+/.eslintrc         export-ignore
 /.gitignore        export-ignore
 /.gitattributes    export-ignore
-/gulpfile.test.js  export-ignore
 /LICENSE           export-ignore
 /README.md         export-ignore

.gitignore

@@ -1,6 +1,9 @@
-# Test output
-test/gulp-tasks
-test/dist
+# Default sources
+/dist
+
+# Test setup/output
+/test/tasks
+/test/dist
 
 # This is a boilerplate: don't keep lockfiles
 node_modules

README.md

@@ -3,68 +3,49 @@ Configurable assets builder
 
 A collection of configurable [gulp](http://gulpjs.com/) tasks we use to build front-end code, mostly for fully static or CMS-based website projects, using [gulp-task-maker](https://www.npmjs.com/package/gulp-task-maker).
 
-⚠ Requires Node.js 4 or later.
+⚠ Requires Node.js 6.5 or later.
 
 Task list
 ---------
 
--   [less](doc/less.md): compile Less stylesheets
--   [mincss](doc/mincss.md): concatenate and minify CSS
--   [minjs](doc/minjs.md): concatenate and minify JS code
--   [sass](doc/sass.md): compile Sass stylesheets
--   [svgsymbols](doc/svgsymbols.md): build SVG symbol sprites
+- [less](doc/less.md): compile Less stylesheets
+- [mincss](doc/mincss.md): concatenate and minify CSS
+- [minjs](doc/minjs.md): concatenate and minify JS code
+- [sass](doc/sass.md): compile Sass stylesheets
+- [svgsymbols](doc/svgsymbols.md): build SVG symbol sprites
 
 Installation
 ------------
 
-### Simple installation
-
-1.  [Download a ZIP of this repo](https://github.com/gradientz/assets-builder/archive/master.zip) and unzip it in your projet directory.
-3.  Change the main config in `gulpfile.js`.
-4.  Finally, in a command prompt, go to your project dir and run: `npm install`.
-
-### Custom installation
-
-1.  Install `gulp` and `gulp-task-maker` as devDependencies: `npm install -D gulp gulp-task-maker`.
-2.  [Download a ZIP of this repo](https://github.com/gradientz/assets-builder/archive/master.zip) and copy the `gulp-tasks` directory or only the task scripts you want to ue.
-3.  Write your own `gulpfile.js`, following the [gulp-task-maker documentation](https://github.com/fvsch/gulp-task-maker/blob/master/README.md).
+1. [Download a ZIP of this repo](https://github.com/gradientz/assets-builder/archive/master.zip) and unzip it in your projet directory.
+3. Change the main config in `gulpfile.js` as needed.
+4. Finally, in a command prompt, go to your project dir and run: `npm install`.
 
 Usage
 -----
 
--   `npm run build`: build assets once
--   `npm run watch`: run in the background and build assets when source files are changed
-
-The first time you try to run a task, e.g. with `npm run build`, you might see an error that looks like this:
-
-```  
-[13:37:21] [gulp-task-maker] Errors in 'sass', 'minjs'
-  …
-  Install missing task dependencies with:
-    npm install -D "gulp-autoprefixer@^3.1" "gulp-sass@^2.3" "gulp-uglify@^2.0"
-```
-
-This is because task dependencies are not installed by default, but documented in the task’s `.json` file. This allows us to maintain as many tasks as we want in this repo, but not install dependencies we don’t use.
+- `npm run build`: build assets once
+- `npm run watch`: run in the background and build assets when source files are changed
 
-Run the provided command (`npm install -D …`), then run `npm run build` again. You should see something like this:
+You should see something like this:
 
 ```
 $ npm run build
 
-> assets-builder@4.0.0 build ~/my-project
+> assets-builder@5.0.0 build ~/my-project
 > gulp build
 
 [13:38:12] Using gulpfile ~/my-project/gulpfile.js
-[13:38:12] Starting 'build-sass'...
-[13:38:12] Starting 'build-minjs'...
-[13:38:12] Starting 'build-svgsymbols'...
-[13:38:14] ./test/dist/ minjs.js 88.59 kB
-[13:38:14] ./test/dist/ sass.css 406 B
-[13:38:14] Finished 'build-minjs' after 2.33 s
-[13:38:14] ./test/dist/ svgsymbols.svg 9.31 kB
-[13:38:14] ./test/dist/ svgsymbols.svg.html 30.6 kB
-[13:38:14] Finished 'build-sass' after 2.37 s
-[13:38:14] Finished 'build-svgsymbols' after 2.34 s
-[13:38:14] Starting 'build'...
-[13:38:14] Finished 'build' after 6.65 μs
+[13:38:12] Starting 'build'...
+[13:38:12] Starting 'build_sass'...
+[13:38:12] Starting 'build_minjs'...
+[13:38:12] Starting 'build_svgsymbols'...
+[13:38:13] ./dist/ main.js 30 B
+[13:38:13] ./dist/ main.css 21 B
+[13:38:13] ./dist/ icons.svg 418 B
+[13:38:13] ./dist/ icons.svg.html 19.5 kB
+[13:38:13] Finished 'build_sass' after 168 ms
+[13:38:13] Finished 'build_minjs' after 168 ms
+[13:38:13] Finished 'build_svgsymbols' after 169 ms
+[13:38:13] Finished 'build' after 171 ms
 ```

doc/less.md

@@ -30,6 +30,10 @@ require("gulp-task-maker").task("gulp-tasks/less.js", {
   // Should we minify with csso?
   minify: true,
 
+  // (Optional; pass a filename to use)
+  // Should we concatenate all resulting files?
+  concat: undefined,
+
   // (Optional; defaults to "."; false to disable)
   // Where should we write sourcemaps (relative to "dest")
   sourcemaps: ".",

doc/mincss.md

@@ -29,6 +29,10 @@ require("gulp-task-maker").task("gulp-tasks/mincss.js", {
   // Should we minify with csso?
   minify: true,
 
+  // (Optional; pass a filename to use)
+  // Should we concatenate all resulting files?
+  concat: undefined,
+
   // (Optional; defaults to "."; false to disable)
   // Where should we write sourcemaps (relative to "dest")
   sourcemaps: ".",

doc/minjs.md

@@ -28,6 +28,10 @@ require("gulp-task-maker").task("gulp-tasks/minjs.js", {
   // Should we minify with csso?
   minify: true,
 
+  // (Optional; pass a filename to use)
+  // Should we concatenate all resulting files?
+  concat: undefined,
+
   // (Optional; defaults to "."; false to disable)
   // Where should we write sourcemaps (relative to "dest")
   sourcemaps: ".",

doc/sass.md

@@ -30,6 +30,10 @@ require("gulp-task-maker").task("gulp-tasks/sass.js", {
   // Should we minify with csso?
   minify: true,
 
+  // (Optional; pass a filename to use)
+  // Should we concatenate all resulting files?
+  concat: undefined,
+
   // (Optional; defaults to "."; false to disable)
   // Where should we write sourcemaps (relative to "dest")
   sourcemaps: ".",

doc/svgsymbols.md

@@ -21,6 +21,10 @@ require("gulp-task-maker").task("gulp-tasks/svgsymbols.js", {
   // Use true to watch the config.src files.
   watch: false,
 
+  // (Optional; defaults to true)
+  // Should we minify with svgo?
+  minify: true,
+
   // (Optional; defaults to false)
   // Should we make a HTML demo page?
   demo: false,
@@ -30,12 +34,12 @@ require("gulp-task-maker").task("gulp-tasks/svgsymbols.js", {
   // "%f" is the cleaned-up original filename.
   id: "icon-%f",
 
-  // (Optional; defaults to the function shown below)
-  // Function that cleans up file names to be used in the symbol’s id attribute
-  slug: name => name.toLowerCase().replace(/[^a-z0-9]/g,""),
-
   // (Optional) XML attributes added to the sprite's root element
   // e.g. {"aria-hidden": "true", height: 0, width: 0}
-  svgAttrs: {}
+  svgAttrs: {},
+
+  // (Optional; defaults to the function shown below)
+  // Function that cleans up file names to be used in the symbol’s id attribute
+  toSlug: name => name.toLowerCase().replace(/[^a-z0-9]/g,""),
 })
 ```