beeblebrox3 /
star
| 1 | var gulp = require("gulp"); |
||
| 2 | var browserify = require("browserify"); |
||
| 3 | var source = require("vinyl-source-stream"); |
||
| 4 | var reactify = require("reactify"); |
||
| 5 | var notify = require("gulp-notify"); |
||
| 6 | var sass = require("gulp-sass"); |
||
| 7 | var cssShrink = require("gulp-cssshrink"); |
||
| 8 | var rename = require("gulp-rename"); |
||
| 9 | var uglify = require("gulp-uglify"); |
||
| 10 | var buffer = require("vinyl-buffer"); |
||
| 11 | var concat = require('gulp-concat'); |
||
| 12 | var browsersync = require("browser-sync").create(); |
||
| 13 | var aliasify = require("aliasify"); |
||
| 14 | var aliasifyConfig = { |
||
| 15 | aliases: { |
||
| 16 | ".env.js": "./.env.js" |
||
| 17 | }, |
||
| 18 | verbose: true |
||
| 19 | }; |
||
| 20 | var environment = "dev"; |
||
| 21 | var errorHandler = function (e) { |
||
| 22 | "use strict"; |
||
| 23 | |||
| 24 | console.log(e); |
||
|
0 ignored issues
–
show
Debugging Code
introduced
by
Loading history...
|
|||
| 25 | notify("ops!"); |
||
| 26 | this.emit("end"); |
||
| 27 | }; |
||
| 28 | |||
| 29 | gulp.task("browsersync", function () { |
||
| 30 | "use strict"; |
||
| 31 | |||
| 32 | browsersync.init({ |
||
| 33 | server: "./web", |
||
| 34 | host: "0.0.0.0", |
||
| 35 | open: false |
||
| 36 | }); |
||
| 37 | |||
| 38 | gulp.watch([ |
||
| 39 | "web/*.html", |
||
| 40 | "web/js/*.js" |
||
| 41 | ]).on("change", browsersync.reload); |
||
| 42 | }); |
||
| 43 | |||
| 44 | gulp.task("browserify", function () { |
||
| 45 | "use strict"; |
||
| 46 | |||
| 47 | var bundle = browserify({ |
||
| 48 | standalone: "App", |
||
| 49 | paths: ["./src/js"], |
||
| 50 | debug: false, |
||
| 51 | insertGlobalVars: true |
||
| 52 | }) |
||
| 53 | .transform(reactify) |
||
| 54 | .transform(aliasify, aliasifyConfig) |
||
| 55 | .on("error", errorHandler) |
||
| 56 | .add("./src/js/bootstrap.js") |
||
| 57 | .bundle() |
||
| 58 | .on("error", errorHandler) |
||
| 59 | .pipe(source("bundle.js")) |
||
| 60 | .pipe(buffer()); |
||
| 61 | |||
| 62 | if (environment === "prod") { |
||
| 63 | bundle.pipe(uglify()); |
||
| 64 | } |
||
| 65 | bundle.pipe(gulp.dest("./web/js")) |
||
| 66 | .pipe(notify("bundle updated")); |
||
| 67 | |||
| 68 | return bundle; |
||
| 69 | }); |
||
| 70 | |||
| 71 | gulp.task("sass", function () { |
||
| 72 | "use strict"; |
||
| 73 | |||
| 74 | return gulp.src([ |
||
| 75 | "./src/css/main.scss" |
||
| 76 | ]) |
||
| 77 | .pipe(sass()) |
||
| 78 | .on("error", errorHandler) |
||
| 79 | .pipe(rename("bundle.css")) |
||
| 80 | .pipe(gulp.dest("./web/css")); |
||
| 81 | }); |
||
| 82 | |||
| 83 | gulp.task("css", ["sass"], function () { |
||
| 84 | "use strict"; |
||
| 85 | |||
| 86 | var bundle = gulp.src([ |
||
| 87 | "web/libs/uikit/css/uikit.min.css", |
||
| 88 | "web/css/bundle.css" |
||
| 89 | ]) |
||
| 90 | .pipe(concat('bundle.min.css')) |
||
| 91 | |||
| 92 | if (environment === "prod") { |
||
| 93 | bundle.pipe(cssShrink()) |
||
| 94 | } |
||
| 95 | |||
| 96 | return bundle.pipe(gulp.dest("./web/css")) |
||
| 97 | .pipe(browsersync.stream()); |
||
| 98 | }); |
||
| 99 | |||
| 100 | gulp.task("dev", ["browserify", "css", "browsersync"], function () { |
||
| 101 | "use strict"; |
||
| 102 | |||
| 103 | gulp.watch(["src/js/**/*.js", "src/js/**/*.jsx"], ["browserify"]); |
||
| 104 | gulp.watch("src/css/**/*.scss", ["css"]); |
||
| 105 | }); |
||
| 106 | |||
| 107 | gulp.task("default", ["browserify", "css"]); |
||
| 108 | |||
| 109 | gulp.task("prod", function () { |
||
| 110 | "use strict"; |
||
| 111 | |||
| 112 | aliasifyConfig.aliases[".env.js"] = "./.env.prod.js"; |
||
| 113 | environment = "prod"; |
||
| 114 | process.env.NODE_ENV = "production"; |
||
| 115 | |||
| 116 | gulp.start("browserify", "css"); |
||
| 117 | }); |
||
| 118 |