-
Notifications
You must be signed in to change notification settings - Fork 5
/
gulpfile.js
148 lines (125 loc) · 4.65 KB
/
gulpfile.js
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
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
const gulp = require("gulp");
const replace = require("gulp-replace");
const mergeStream = require("merge-stream");
const gulpBabel = require("gulp-babel");
const symlink = require("gulp-sym");
const htmlMinify = require("gulp-htmlmin");
const babelMinify = require("gulp-babel-minify");
const gulpif = require("gulp-if");
const del = require("del");
const rollup = require("rollup");
const PolymerProject = require("polymer-build").PolymerProject;
const HtmlSplitter = require("polymer-build").HtmlSplitter;
const htmlMinifyOptions = {
collapseWhitespace: true,
removeComments: true,
minifyCSS: true
};
gulp.task("code", ["pre-build"], () => {
process.chdir("./build-temp");
const project = new PolymerProject({
entrypoint: "index.html"
});
const sourcesHtmlSplitter = new HtmlSplitter();
return mergeStream(project.sources(), project.dependencies())
.pipe(replace("process.env.NODE_ENV", `"production"`))
.pipe(replace("__VERSION__", getVersion()))
.pipe(sourcesHtmlSplitter.split())
.pipe(gulpif(/\.html$/, htmlMinify(htmlMinifyOptions)))
.pipe(gulpif(/\.js$/, babelMinify(null, { comments: false })))
.pipe(sourcesHtmlSplitter.rejoin())
.pipe(project.bundler())
.pipe(gulp.dest("../build/"));
});
gulp.task("pre-build", ["clean"], () => {
return mergeStream(
gulp.src("./src/**/*.html")
.pipe(replace(/<script type="module" src="(.+?)".+?>/g, function(_, src) {
// Compile all <script type="module"> and put them in a "built"
// directory.
const name = Math.floor(Math.random() * 10000) + "";
const path = this.file.path.match(/(^.*\/)/)[1];
const foldersDeep = this.file.path.match(/(\/)/g).length -
this.file.cwd.match(/(\/)/g).length - 1;
rollup.rollup({
input: `${path}${src}`
}).then(bundle => bundle.write({
file: `./build-temp/built/${name}.js`,
format: "iife",
name: `b${name}`,
exports: "named"
}));
return `<script src="${"../".repeat(foldersDeep)}built/${name}.js">`;
}))
.pipe(transpileWithinHtml())
.pipe(gulp.dest("./build-temp/src/")),
gulp.src(["./src/**/*.js", "!./src/renderer/**/*"])
.pipe(gulpBabel())
.pipe(gulp.dest("./build-temp/src/")),
gulp.src(["./node_modules", "./bower_components"])
.pipe(symlink(["./build-temp/node_modules", "./build-temp/bower_components"])),
gulp.src("./index.html")
.pipe(gulp.dest("./build-temp/"))
);
});
gulp.task("image", ["clean"], () => {
return gulp.src("./img/**/*")
.pipe(gulp.dest("./build/img/"));
});
gulp.task("meta", ["clean"], () => {
return gulp.src("./manifest.json")
.pipe(gulp.dest("./build/"));
});
gulp.task("clean", () => {
return del([
"build", "build-temp"
]);
});
function getVersion() {
const branch = process.env.TRAVIS_BRANCH;
const buildNo = process.env.TRAVIS_BUILD_NUMBER;
const commit = process.env.TRAVIS_COMMIT;
if (branch && buildNo && commit) {
return branch + buildNo + " (" + commit.substring(0, 7) + ")";
} else {
return "N/A";
}
}
gulp.task("default", ["code", "image", "meta"]);
// ***
// Hacky HTML-babel transpiler because polymer-build is pretty shitty
// (If you haven't noticed, I'm pretty pissed as of writing this)
// ***
const through = require("through2");
const babelCore = require("babel-core");
function transpileWithinHtml(opts) {
opts = opts || {};
return through.obj(function(file, enc, cb) {
if (file.isNull()) {
cb(null, file);
return;
}
try {
const fileOpts = Object.assign({}, opts, {
filename: file.path,
filenameRelative: file.relative,
sourceMap: Boolean(file.sourceMap),
sourceFileName: file.relative,
sourceMapTarget: file.relative
});
const html = file.contents.toString().replace(
/([\S\s]*?<script>)([\S\s]+?)(<\/script>[\S\s])/g,
(match, before, js, after) => {
const { code } = babelCore.transform(js, fileOpts);
return `${before}${code}${after}`;
}
);
file.contents = new Buffer(html);
this.push(file);
} catch (err) {
console.error(`[**] ${err}`);
this.emit("error");
}
cb();
});
};