Use Gulp for automated packaging

bryanjhv · Sep 2, 2016 · 6ff09ce · 6ff09ce
1 parent e04e39d
commit 6ff09ce
Show file tree

Hide file tree

Showing 4 changed files with 105 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -7,3 +7,7 @@ app/lib/
 # NodeJS
 node_modules/
 npm-debug.log
+
+# Generated
+dist/
+package.zip
diff --git a/app/index.html b/app/index.html
@@ -5,11 +5,15 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
   <title>Ruby2Go</title>
   <link rel="manifest" href="manifest.webapp">
+  <!-- build:css css/vendor.css -->
   <link rel="stylesheet" href="lib/codemirror/lib/codemirror.css">
   <link rel="stylesheet" href="lib/codemirror/theme/material.css">
+  <!-- endbuild -->
+  <!-- build:css css/app.css -->
   <link rel="stylesheet" href="css/icons.css">
   <link rel="stylesheet" href="css/transitions.css">
   <link rel="stylesheet" href="css/main.css">
+  <!-- endbuild -->
 </head>
 <body role="application">
 <section role="region" id="page-code">
@@ -79,11 +83,15 @@ <h2>License</h2>
   </article>
 </section>
 
+<!-- build:js js/vendor.js -->
 <script src="lib/codemirror/lib/codemirror.js"></script>
 <script src="lib/codemirror/mode/ruby/ruby.js"></script>
 <script src="lib/codemirror/addon/display/placeholder.js"></script>
+<!-- endbuild -->
+<!-- build:js js/app.js -->
 <script src="js/transitions.js"></script>
 <script src="js/run.js"></script>
 <script src="js/main.js"></script>
+<!-- endbuild -->
 </body>
 </html>
diff --git a/gulpfile.js b/gulpfile.js
@@ -0,0 +1,80 @@
+var gulp = require('gulp');
+
+var
+  del = require('del'),
+  useref = require('gulp-useref'),
+  gulpif = require('gulp-if'),
+  htmlmin = require('gulp-htmlmin'),
+  mincss = require('gulp-clean-css'),
+  uglify = require('gulp-uglify'),
+  concat = require('gulp-concat'),
+  replace = require('gulp-replace'),
+  copy = require('gulp-copy'),
+  zip = require('gulp-zip');
+
+
+var uglifyOpts = {
+  compress: {
+    global_defs: {
+      exports: false,
+      define: false
+    }
+  }
+};
+
+
+gulp.task('clean', function () {
+  return del([
+    'dist',
+    'package.zip'
+  ]);
+});
+
+gulp.task('minify', ['clean'], function () {
+  return gulp.
+  src('app/index.html').
+  pipe(useref()).
+  pipe(gulpif('*.html', htmlmin({ collapseWhitespace: true }))).
+  pipe(gulpif('*.css', mincss())).
+  pipe(gulpif('*.js', uglify(uglifyOpts))).
+  pipe(gulp.dest('dist'));
+});
+
+gulp.task('opal', ['clean'], function () {
+  var base = 'app/lib/opal/opal/' + require('./bower').dependencies.opal;
+
+  return gulp.
+  src([
+    base + '/opal.js',
+    base + '/opal-parser.js'
+  ]).
+  pipe(concat('opal.js')).
+  pipe(uglify()).
+  pipe(gulp.dest('dist/js'));
+});
+
+gulp.task('worker', ['opal'], function () {
+  return gulp.
+  src('app/js/worker.js').
+  pipe(replace(/importScripts\([^)]+\);/m, 'importScripts("../js/opal.js");')).
+  pipe(uglify()).
+  pipe(gulp.dest('dist/js'));
+});
+
+gulp.task('copy', ['clean'], function () {
+  return gulp.
+  src([
+    'app/img/**/*',
+    'app/manifest.webapp'
+  ]).
+  pipe(copy('dist', { prefix: 1 }));
+});
+
+gulp.task('package', ['minify', 'worker', 'copy'], function () {
+  return gulp.
+  src('dist/**/*').
+  pipe(zip('package.zip')).
+  pipe(gulp.dest('.'));
+});
+
+gulp.task('default', ['package']);
diff --git a/package.json b/package.json
@@ -10,5 +10,18 @@
   "license": "MIT",
   "author": "Bryan Horna <bryanjhv@gmail.com> (https://bryanjhv.xyz)",
   "repository": "bryanjhv/ruby2go",
+  "devDependencies": {
+    "del": "~2.2.2",
+    "gulp": "~3.9.1",
+    "gulp-clean-css": "~2.0.12",
+    "gulp-concat": "~2.6.0",
+    "gulp-copy": "0.0.2",
+    "gulp-htmlmin": "~2.0.0",
+    "gulp-if": "~2.0.1",
+    "gulp-replace": "~0.5.4",
+    "gulp-uglify": "~2.0.0",
+    "gulp-useref": "~3.1.2",
+    "gulp-zip": "~3.2.0"
+  },
   "private": true
 }