Use gulp to build kong-dashboard. Reduce docker image size. Npm packa…

…ge to include built app

.dockerignore

@@ -1,8 +1,6 @@
 .idea/
+.vagrant
 *.iml
-.dockerignore
-Dockerfile
 node_modules/
 public/
 screenshots/
-.vagrant

.gitignore

@@ -1,7 +1,6 @@
 .idea/
+.vagrant
 *.iml
-bower_components/
 node_modules/
 public/
 src/scss/_custom_theme.scss
-.vagrant

.npmignore

@@ -0,0 +1,6 @@
+.idea/
+.vagrant
+*.iml
+node_modules/
+screenshots/
+src/scss/_custom_theme.scss

Dockerfile

@@ -3,8 +3,8 @@ FROM mhart/alpine-node:7.5.0
 COPY . /app
 WORKDIR /app
 
-RUN npm install --unsafe-perm
+RUN npm install && npm run build && npm prune --production
 
 EXPOSE 8080
 
-CMD npm run start
+ENTRYPOINT ["./docker-entrypoint.sh"]

README.md

@@ -71,6 +71,7 @@ git checkout 1.0
 
 # Build Kong Dashboard
 npm install
+npm run build
 
 # Start Kong Dashboard
 npm start
@@ -91,7 +92,7 @@ docker run -d -p 8080:8080 pgbi/kong-dashboard:v1
 docker run -d -p [port]:8080 pgbi/kong-dashboard:v1
 
 # Start Kong Dashboard with basic auth
-docker run -d -p 8080:8080 pgbi/kong-dashboard:v1 npm start -- -a user=password
+docker run -d -p 8080:8080 pgbi/kong-dashboard:v1 -a user=password
 ```
 
 

bin/kong-dashboard.js

@@ -1,8 +1,8 @@
 #!/usr/bin/env node
 
-var dashboard = require('../lib/kong-dashboard');
 var parseArgs = require('minimist');
 var argv = parseArgs(process.argv.slice(2));
+var child_process = require('child_process');
 
 // validate options
 var validOptions = ['_', 'a', 'p'];
@@ -35,5 +35,24 @@ if (argv._[0] === 'build') {
 if (argv._[0] === 'start') {
     var port = argv.p ? argv.p : 8080;
     var auth = argv.a;
-    dashboard.serve(port, auth);
+
+    // launch server
+    console.log('Launching webserver');
+    if (port) {
+        process.env['kong-dashboard-port'] = port;
+    }
+    if (auth) {
+        auth = auth.split('=');
+        process.env['kong-dashboard-name'] = auth[0];
+        process.env['kong-dashboard-pass'] = auth[1];
+    }
+    var server = child_process.fork(__dirname + '/server', [], {
+        env: process.env
+    });
+    server.on('message', function (message) {
+        process.stdout.write(message);
+    });
+    server.on('close', function (message) {
+        process.stdout.write('Proxy server is down.');
+    });
 }

docker-entrypoint.sh

@@ -0,0 +1,3 @@
+#!/bin/sh
+
+npm run start -- $@

gulpfile.js

@@ -0,0 +1,71 @@
+'use strict';
+
+var child_process = require('child_process');
+var concat = require('gulp-concat');
+var fs = require('fs');
+var gulp = require('gulp');
+var sass = require('gulp-sass');
+var uglify = require('gulp-uglify');
+
+// Define file path variables
+var paths = {
+  root:     'src/',
+  js_src:   'src/js',
+  sass_src: 'src/scss',
+  html_src: 'src/html',
+  css_src:  'src/scss',
+  dist:     'public'
+};
+
+gulp.task('build_js', function () {
+  return gulp
+    .src([
+      "./node_modules/jquery/dist/jquery.min.js",
+      "./node_modules/angular/angular.min.js",
+      "./node_modules/angular-route/angular-route.min.js",
+      "./node_modules/angular-cookies/angular-cookies.min.js",
+      "./node_modules/angular-animate/angular-animate.min.js",
+      "./node_modules/angular-sanitize/angular-sanitize.min.js",
+      "./node_modules/materialize-css/dist/js/materialize.min.js",
+      "./node_modules/ng-infinite-scroll/build/ng-infinite-scroll.min.js",
+      paths.js_src + '/**/*.js'
+    ])
+    .pipe(uglify())
+    .pipe(concat('app.min.js'))
+    .pipe(gulp.dest(paths.dist + '/js'));
+});
+
+gulp.task('build_html', function() {
+  gulp.src([paths.html_src + '/index.html'])
+    .pipe(gulp.dest(paths.dist));
+  gulp.src([paths.html_src + '/**/*'])
+    .pipe(gulp.dest(paths.dist + '/html'));
+  gulp.src(['node_modules/materialize-css/dist/fonts/roboto/**/*'])
+    .pipe(gulp.dest(paths.dist + '/fonts/roboto'));
+});
+
+gulp.task('build_css', function() {
+  var src_file = 'app.scss';
+  if (fs.existsSync(paths.sass_src + '/custom_app.scss')) {
+    src_file = 'custom_app.scss';
+  }
+  gulp.src([paths.sass_src + '/' + src_file])
+    .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
+    .pipe(concat('app.min.css'))
+    .pipe(gulp.dest(paths.dist + '/css'));
+});
+
+gulp.task('build', ['build_js', 'build_css', 'build_html']);
+
+gulp.task('watch', function() {
+  gulp.watch(paths.js_src + '/**/*.js', ['build_js']);
+  gulp.watch(paths.html_src + '/**/*.html', ['build_html']);
+  gulp.watch(paths.sass_src + '/**/*.scss', ['build_css']);
+});
+
+gulp.task('serve', ['build', 'watch'], function() {
+  var args = process.argv;
+  args.push('start');
+  args = args.slice(3);
+  child_process.fork(__dirname + '/bin/kong-dashboard', args);
+});

package.json

@@ -9,38 +9,38 @@
     "url": "https://github.com/PGBI/kong-dashboard.git"
   },
   "dependencies": {
-    "angular": "1.4.7",
-    "angular-animate": "1.4.7",
-    "angular-cookies": "1.4.7",
-    "angular-route": "1.4.7",
-    "angular-sanitize": "1.4.7",
     "basic-auth": "^1.1.0",
-    "fs-extra": "^1.0.0",
-    "glob": "^7.1.1",
     "http-proxy": "^1.16.2",
-    "jquery": "^3.1.1",
     "koa": "^1.2.4",
     "koa-add-trailing-slashes": "^1.1.0",
     "koa-basic-auth": "^1.1.2",
     "koa-mount": "^1.3.0",
     "koa-static": "^2.0.0",
-    "materialize-css": "0.97.7",
-    "minimist": "^1.2.0",
-    "ng-infinite-scroll": "^1.3.0",
-    "node-sass": "^4.1.1",
-    "rimraf": "^2.5.4",
-    "uglify-js": "^2.7.5"
+    "minimist": "^1.2.0"
   },
   "bin": {
     "kong-dashboard": "./bin/kong-dashboard.js"
   },
   "scripts": {
-    "install": "node ./bin/kong-dashboard build",
+    "prepublishOnly": "node_modules/.bin/gulp build",
+    "build": "node_modules/.bin/gulp build",
     "start": "node ./bin/kong-dashboard start",
     "test": "mocha"
   },
   "devDependencies": {
+    "angular": "1.4.7",
+    "angular-animate": "1.4.7",
+    "angular-cookies": "1.4.7",
+    "angular-route": "1.4.7",
+    "angular-sanitize": "1.4.7",
     "chai": "^3.5.0",
-    "mocha": "^3.2.0"
+    "gulp": "^3.9.1",
+    "gulp-concat": "^2.6.1",
+    "gulp-sass": "^3.1.0",
+    "gulp-uglify": "^3.0.0",
+    "jquery": "^3.1.1",
+    "materialize-css": "0.97.7",
+    "mocha": "^3.2.0",
+    "ng-infinite-scroll": "^1.3.0"
   }
 }

provision.sh

@@ -1,8 +1,10 @@
 #!/bin/bash
 cd /vagrant
-sudo apt-get update
-sudo apt-get install -y nodejs npm git
-sudo ln -s /usr/bin/nodejs /usr/bin/node
-sudo rm -r node_modules
-sudo -u vagrant -H sh -c "npm install"
+
+curl -sL https://deb.nodesource.com/setup_7.x | sudo -E bash -
+apt-get update
+apt-get install -y nodejs git
+
+rm -r node_modules
+npm install && npm run build && npm prune --production
 echo "Successfully Installed Kong Dashboard."