objectiv-starter-theme/gulpfile.js at master · Objectivco/objectiv-starter-theme · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
const gulp = require("gulp");
const sass = require("gulp-sass");
const sourcemaps = require("gulp-sourcemaps");
const concat = require("gulp-concat");
const rename = require("gulp-rename");
const uglify = require("gulp-uglify");
const postcss = require("gulp-postcss");
const autoprefixer = require("autoprefixer");
const bourbon = require("bourbon").includePaths;
const neat = require("bourbon-neat").includePaths;
const svgmin = require("gulp-svgmin");
const svgstore = require("gulp-svgstore");
const del = require("del");
const cheerio = require("gulp-cheerio");
const babel = require("gulp-babel");

const paths = {
    sass: "assets/sass/**/*.scss",
    js: "assets/js/src/*.js",
    icons: "assets/icons/svg-icons/*.svg"
};

/**
 * Task to compile Sass styles
 */
gulp.task("sass", () => {
    gulp
        .src(paths.sass)
        .pipe(sourcemaps.init())
        .pipe(
            sass({
                outputStyle: "expanded",
                includePaths: [bourbon, neat]
            }).on("error", sass.logError)
        )
        .pipe(
            postcss([
                autoprefixer({
                    browsers: ["last 2 version"]
                })
            ])
        )
        .pipe(sourcemaps.write("./assets/maps"))
        .pipe(gulp.dest("./"));
});

/**
 * Task to concat and compile svg into a single file
 */
gulp.task("svg", () => {
    gulp
        .src(paths.icons)
        .pipe(svgmin())
        .pipe(rename({ prefix: "icon-" }))
        .pipe(svgstore({ inlineSvg: true }))
        .pipe(
            cheerio({
                run: function($, file) {
                    $("svg").attr("style", "display: none");
                    $("[fill]").removeAttr("fill");
                    $("path").removeAttr("class");
                },
                parserOptions: { xmlMode: true }
            })
        )
        .pipe(gulp.dest("assets/icons"));
});

/**
 * Concat and compile JS files
 */
gulp.task("concat", () =>
    gulp
        .src(paths.js)
        .pipe(sourcemaps.init())
        .pipe(
            babel({
                presets: ["es2015"]
            })
        )
        .pipe(concat("index.js"))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest("assets/js"))
);

/**
 * Minify JS
 */
gulp.task("uglify", ["concat"], () =>
    gulp
        .src(["assets/js/*.js", "!assets/js/*.min.js"])
        .pipe(rename({ suffix: ".min" }))
        .pipe(
            uglify({
                mangle: false
            })
        )
        .pipe(gulp.dest("assets/js"))
);

/**
 * Watch tasks
 */
gulp.task("sass:watch", function() {
    gulp.watch("./assets/sass/**/*.scss", ["sass"]);
});

gulp.task("js:watch", function() {
    gulp.watch("./assets/js/**/*.js", ["js"]);
});

gulp.task("icons", ["svg"]);
gulp.task("js", ["uglify"]);
gulp.task("default", ["sass", "sass:watch", "js", "js:watch"]);