dimensionr.github.io/gulpfile.babel.js at master · dimensionr/dimensionr.github.io · 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
import {src, dest, watch, parallel, series} from 'gulp';
import browserify from "browserify";
import server from 'browser-sync';
import source from "vinyl-source-stream";
import stylus from "gulp-stylus"
import pug from "gulp-pug"
import plumber from "gulp-plumber"
import path from "path"

let resolve = (...paths) => path.join(__dirname, ...paths)

/* Directories and Paths */
let dirs = {
  src : resolve("src"),
  css : resolve("public/css"),
  js : resolve("public/js"),
  public : resolve("public/"),
  root : resolve("/")
}

let paths = {
  js : "",
  css : "",
  pug : {
    entry : [dirs.src + "/pug/index.pug", dirs.src + "/pug/**/*.pug", "!" + dirs.src + "/pug/layout.pug", "!" + dirs.src + "/pug/partials/*.pug"],
    all : dirs.src + "/pug/**/*.pug"
  },
  stylus : {
    entry : dirs.src + "/stylus/themes/**/*.theme.styl",
    all : dirs.src + "/stylus/**/*.styl"
  },
  static: {
    entry: dirs.src + '/**/assets/**' ,
    all: dirs.src + '/**/assets/**'
  }
}

/* stylus */
export let css = done => src(paths.stylus.entry)
.pipe(plumber())
  .pipe(stylus())
  .pipe(dest(dirs.css))
  .pipe(server.stream())

/* pug */
export let html = done => src(paths.pug.entry)
  .pipe(plumber())
  .pipe(pug({
    pretty: true,
    basedir: __dirname + '/src/pug'
  }))
  .pipe(dest(dirs.root))
  .pipe(server.stream())

/* static */
export let assets = done => src(paths.static.entry, {base: dirs.src})
  .pipe(dest(dirs.public))
  .pipe(server.stream())


/* watch */
export let watching = done => {
  watch(paths.stylus.all, css)
  watch(paths.pug.all, html)
  watch(paths.static.all, assets).on('change', server.reload)
  done()
}


// gulp.task('serve', ['watch'], () => {
//   browserSync({
//     notify: false,
//     open:false,
//     port: 3000,
//     server: {
//       baseDir: '.'
//     }
//   });
//
//   gulp.watch([
//     '**/*.html',
//     'assets/**/*.css',
//     'assets/**/*.js'
//   ]).on('change', browserSync.reload);
// });

export let serve = done => {
  server.init({
    server: {
      baseDir: dirs.root
    },
    open: false,
    tunnel: false,
    notify: false
  })
  done()
}

export const dev = series(css, html, assets, serve, watching)

export default dev;