Change grunt for gulp

Gruntfile.js

@@ -1,35 +0,0 @@
-/**
- * Grunt Task Wrangler
- *
- * @copyright Copyright © 2016 Locomotive
- * @license   Licensed under the MIT license.
- */
-
-'use strict';
-
-module.exports = function (grunt)
-{
-    var path = require('path');
-
-    require('load-grunt-config')(grunt, {
-        configPath: path.join(process.cwd(), 'build/grunt/config'),
-        data: {
-            paths: {
-                grunt: 'build/grunt',
-                npm:   'node_modules',
-                js: {
-                    src:  'assets/scripts',
-                    dist: 'www/assets/scripts'
-                },
-                css: {
-                    src:  'assets/styles',
-                    dist: 'www/assets/styles'
-                },
-                img: {
-                    src:  'assets/images',
-                    dist: 'www/assets/images'
-                }
-            }
-        }
-    });
-};

build/concat.js

@@ -0,0 +1,14 @@
+import gulp from 'gulp';
+import gulpConcat from 'gulp-concat';
+import paths from '../mconfig.json';
+
+function concat() {
+    return gulp
+        .src([
+            `${paths.scripts.vendors.src}*.js`
+        ])
+        .pipe(gulpConcat(`${paths.scripts.vendors.main}.js`))
+        .pipe(gulp.dest(paths.scripts.dest));
+}
+
+export default concat;

build/grunt/config/aliases.json

@@ -1,41 +0,0 @@
-{
-    "default": [
-        "build"
-    ],
-
-    "sync": [
-        "browserSync",
-        "browserify:dev",
-        "watch",
-        "notify:watch"
-    ],
-
-    "build": [
-        "sass",
-        "postcss",
-        "cssmin",
-        "browserify:prod",
-        "concat:prod",
-        "uglify",
-        "svg_sprite",
-        "notify:build"
-    ],
-
-    "w": [
-        "browserify:dev",
-        "watch",
-        "notify:watch"
-    ],
-
-    "c": [
-        "csscomb"
-    ],
-
-    "j": [
-        "eslint"
-    ],
-
-    "p": [
-        "phplint"
-    ]
-}

build/grunt/config/browserSync.js

@@ -1,20 +0,0 @@
-module.exports = {
-    options: {
-        open      : false,
-        proxy     : 'locomotive-boilerplate.test',
-        port      : 3000,
-        watchTask : true,
-        notify    : false
-    },
-    dev: {
-        bsFiles: {
-            src : [
-                '<%= paths.css.dist %>/**/*.css',
-                '<%= paths.js.dist %>/**/*.js',
-                '<%= paths.img.dist %>/**/*.svg',
-                '**/*.php',
-                '**/*.html',
-            ]
-        }
-    }
-};

build/grunt/config/browserify.js

@@ -1,39 +0,0 @@
-module.exports = {
-    options: {
-        browserifyOptions: {
-            debug: false
-        },
-        exclude: "",
-        transform: [
-            ['babelify', {
-                presets: ['env'],
-                plugins: [
-                    ['transform-class-properties']
-                ]
-            }]
-        ]
-    },
-    dev: {
-        options: {
-            browserifyOptions: {
-                debug: true
-            },
-            watch: true
-        },
-        src: [
-            '<%= paths.js.src %>/**/*.js',
-            '!<%= paths.js.src %>/vendors/**/*.js'
-        ],
-        dest: '<%= paths.js.dist %>/app.js'
-    },
-    prod: {
-        options: {
-            banner: '/*! <%= package.title %> - <%= grunt.template.today("yyyy-mm-dd") %> */\n'
-        },
-        src: [
-            '<%= paths.js.src %>/**/*.js',
-            '!<%= paths.js.src %>/vendors/**/*.js'
-        ],
-        dest: '<%= paths.js.dist %>/app.js'
-    }
-};

build/grunt/config/concat.js

@@ -1,14 +0,0 @@
-module.exports = {
-    prod: {
-        options: {
-            banner: '/*! Dependencies for <%= package.title %> - <%= grunt.template.today("yyyy-mm-dd") %> */\n'
-        },
-        src  : [
-            '<%= paths.js.src %>/vendors/**/*.js',
-            '<%= paths.npm %>/pjax/pjax.js',
-            '<%= paths.npm %>/svg4everybody/dist/svg4everybody.js'
-        ],
-        dest : '<%= paths.js.dist %>/vendors.js'
-    }
-};
-

build/grunt/config/csscomb.js

@@ -1,15 +0,0 @@
-module.exports = {
-    options: {
-        config: '.csscomb.json'
-    },
-    dev: {
-        files: [
-            {
-                expand : true,
-                cwd    : '<%= paths.css.src %>',
-                src    : [ '**/*.scss', '!base/_fonts.scss' ],
-                dest   : '<%= paths.css.src %>'
-            }
-        ]
-    }
-};

build/grunt/config/cssmin.js

@@ -1,13 +0,0 @@
-module.exports = {
-    options: {},
-    prod: {
-        files: [
-            {
-                expand : true,
-                cwd    : '<%= paths.css.dist %>',
-                src    : [ '**/*.css', '!**/*.min.css' ],
-                dest   : '<%= paths.css.dist %>'
-            }
-        ]
-    }
-};

build/grunt/config/eslint.js

@@ -1,11 +0,0 @@
-module.exports = {
-    options: {
-        quiet      : false,
-        format     : require('eslint-tap'),
-        configFile : '.eslintrc'
-    },
-    dev: [
-        '<%= paths.js.src %>/**/*.js',
-        '!<%= paths.js.src %>/vendors/**/*.js'
-    ]
-};

build/grunt/config/notify.js

@@ -1,36 +0,0 @@
-module.exports = {
-    notify_hooks: {
-        options: {
-            enabled  : true,
-            success  : true,
-            duration : 3,
-            title    : '<%= package.name %>',
-            max_jshint_notifications : 5
-        }
-    },
-    watch: {
-        options: {
-            message: 'Keeping an eye out, Chief!'
-        }
-    },
-    build: {
-        options: {
-            message: 'Everything is ready to go!'
-        }
-    },
-    sass: {
-        options: {
-            message: 'CSS is compiled'
-        }
-    },
-    javascript: {
-        options: {
-            message: 'JavaScript is compiled'
-        }
-    },
-    svg: {
-        options: {
-            message: 'SVG is concatenated'
-        }
-    }
-};

build/grunt/config/phplint.js

@@ -1,12 +0,0 @@
-module.exports = {
-    options: {
-        swapPath : '/tmp',
-        phpArgs  : {
-            // add -f for fatal errors
-            '-lf': null
-        }
-    },
-    dev: [
-        '**/*.php'
-    ]
-};

build/grunt/config/postcss.js

@@ -1,27 +0,0 @@
-module.exports = function (grunt, options)
-{
-    return {
-        options: {
-            map: false,
-            processors: [
-                require('autoprefixer')({
-                    browsers: [ 'last 2 versions', '> 1%', 'ie >= 9' ]
-                }),
-                require('postcss-banner')({
-                    banner: grunt.template.process('! <%= package.title %> - <%= grunt.template.today("yyyy-mm-dd") %> ', { data: options })
-                })
-            ]
-        },
-        prod: {
-            files: [
-                {
-                    expand  : true,
-                    flatten : true,
-                    cwd     : '<%= paths.css.dist %>',
-                    src     : [ '**/*.css', '!**/*.min.css' ],
-                    dest    : '<%= paths.css.dist %>'
-                }
-            ]
-        }
-    }
-};

build/grunt/config/sass.js

@@ -1,17 +0,0 @@
-module.exports = {
-    options: {
-        sourceMap   : false,
-        outputStyle : 'expanded'
-    },
-    prod: {
-        files: [
-            {
-                expand : true,
-                cwd    : '<%= paths.css.src %>',
-                src    : [ '**/*.scss' ],
-                dest   : '<%= paths.css.dist %>',
-                ext    : '.css'
-            }
-        ]
-    }
-};

build/grunt/config/svg_sprite.js

@@ -1,29 +0,0 @@
-module.exports = {
-    options : {
-        svg: {
-            xmlDeclaration       : false,
-            namespaceIDs         : true,
-            doctypeDeclaration   : false,
-            cleanupNumericValues : true,
-            removeTitle          : true,
-            removeDesc           : true
-        }
-    },
-    prod: {
-        expand  : true,
-        cwd     : '<%= paths.img.src %>',
-        src     : [ '**/*.svg', '!sprite.svg' ],
-        dest    : '<%= paths.img.dist %>',
-        options : {
-            mode: {
-                symbol: {
-                    dest    : '.',
-                    sprite  : 'sprite.svg',
-                    example : {
-                        dest: '../../../build/sprite.symbol.html'
-                    }
-                }
-            }
-        }
-    }
-}

build/grunt/config/uglify.js

@@ -1,13 +0,0 @@
-module.exports = {
-    options: {},
-    prod: {
-        files: [
-            {
-                expand : true,
-                cwd    : '<%= paths.js.dist %>',
-                src    : [ '**/*.js', '!**/*.min.js' ],
-                dest   : '<%= paths.js.dist %>'
-            }
-        ]
-    }
-};

build/grunt/config/watch.js

@@ -1,27 +0,0 @@
-module.exports = {
-    options: {
-        spawn: false,
-        livereload: false
-    },
-    javascript_vendors: {
-        files: [ '<%= paths.js.src %>/vendors/**/*.js', '<%= paths.grunt %>/config/concat.js' ],
-        tasks: [ 'concat', 'notify:javascript' ]
-    },
-    sass: {
-        files: [ '<%= paths.css.src %>/**/*.scss' ],
-        tasks: [ 'sass', 'postcss', 'notify:sass' ]
-    },
-    svg: {
-        files: [ '<%= paths.img.src %>/**/*.svg' ],
-        tasks: [ 'svg_sprite', 'notify:svg' ]
-    },
-    tasks: {
-        options: {
-            reload: true
-        },
-        files: [
-            'Gruntfile.js',
-            '<%= paths.grunt %>/**/*'
-        ]
-    }
-};

build/serve.js

@@ -0,0 +1,14 @@
+import browserSync from 'browser-sync';
+import paths from '../mconfig.json';
+
+export const server = browserSync.create();
+
+function serve(done) {
+    server.init({
+        notify: false,
+        proxy: paths.url
+    });
+    done();
+}
+
+export default serve;

build/watch.js

@@ -0,0 +1,22 @@
+import gulp from 'gulp';
+import paths from '../mconfig.json';
+import styles from './styles.js';
+import scripts from './scripts.js';
+import svgs from './svgs.js';
+import concat from './concat.js';
+import { server } from './serve.js';
+
+function watch() {
+    gulp.watch(paths.styles.src, styles);
+    gulp.watch(paths.scripts.src, gulp.series(scripts, reload));
+    gulp.watch(paths.scripts.vendors.src, concat);
+    gulp.watch(paths.views.src, reload);
+    gulp.watch(paths.svgs.src, gulp.series(svgs, reload));
+}
+
+function reload(done) {
+    server.reload();
+    done();
+}
+
+export default watch;

gulpfile.babel.js

@@ -0,0 +1,16 @@
+import gulp from 'gulp';
+import styles from './build/styles.js';
+import scripts from './build/scripts.js';
+import concat from './build/concat.js';
+import svgs from './build/svgs.js';
+import serve from './build/serve.js';
+import watch from './build/watch.js';
+import { buildStyles, buildScripts } from './build/build.js';
+
+const compile = gulp.series(styles, scripts, svgs, concat);
+const main = gulp.series(compile, serve, watch);
+const build = gulp.series(compile, buildStyles, buildScripts);
+
+gulp.task('default', main);
+gulp.task('compile', compile);
+gulp.task('build', build);

mconfig.json

@@ -0,0 +1,33 @@
+{
+  "url": "boilerplate.test",
+  "src": "./assets/",
+  "dest": "./www/",
+  "build": "./build/",
+  "styles": {
+    "src": "./assets/styles/",
+    "dest": "./www/assets/styles/",
+    "main": "main"
+  },
+  "scripts": {
+    "src": "./assets/scripts/",
+    "dest": "./www/assets/scripts/",
+    "main": "app",
+    "vendors": {
+      "src": "./assets/scripts/vendors/",
+      "main": "vendors"
+    }
+  },
+  "svgs": {
+    "src": "./assets/images/sprite/",
+    "dest": "./www/assets/images/"
+  },
+  "views": {
+    "src": "./views/boilerplate/template/"
+  },
+  "modules": {
+    "build": "gulp",
+    "style": "sass",
+    "script": "js",
+    "view": false
+  }
+}

package.json

@@ -1,4 +1,3 @@
-
 {
     "private": true,
     "name": "@locomotivemtl/boilerplate",
@@ -6,33 +5,10 @@
     "version": "1.0.0",
     "author": "Locomotive <info@locomotive.ca>",
     "dependencies": {
-        "pjax": "0.0.0",
-        "svg4everybody": "0.0.0"
+        "pjax": "*",
+        "svg4everybody": "*"
     },
     "devDependencies": {
-        "autoprefixer": "0.0.0",
-        "babel-core": "0.0.0",
-        "babel-preset-env": "0.0.0",
-        "babel-plugin-transform-class-properties": "0.0.0",
-        "babel-plugin-transform-export-extensions": "0.0.0",
-        "babelify": "0.0.0",
-        "eslint-tap": "0.0.0",
-        "glob": "0.0.0",
-        "grunt": "0.0.0",
-        "grunt-browser-sync": "0.0.0",
-        "grunt-browserify": "0.0.0",
-        "grunt-contrib-concat": "0.0.0",
-        "grunt-contrib-cssmin": "0.0.0",
-        "grunt-contrib-uglify": "0.0.0",
-        "grunt-contrib-watch": "0.0.0",
-        "grunt-csscomb": "0.0.0",
-        "grunt-eslint": "0.0.0",
-        "grunt-notify": "0.0.0",
-        "grunt-phplint": "0.0.0",
-        "grunt-postcss": "0.0.0",
-        "grunt-sass": "0.0.0",
-        "grunt-svg-sprite": "0.0.0",
-        "load-grunt-config": "0.0.0",
-        "postcss-banner": "0.0.0"
+        "gulp-concat": "*"
     }
 }