FROM node

RUN mkdir /runtime
WORKDIR /runtime

RUN npm init -y

#install gulp for auto build
RUN npm install --save-dev gulp gulp-uglify;
RUN npm install --save-dev del;
RUN npm install --save-dev vinyl-source-stream;
RUN npm install --save-dev browserify;
RUN npm install --save-dev reactify;
RUN npm install --save-dev react react-dom;


#install react and build tool
#RUN npm install -g browserify
#RUN npm install --save-dev react react-dom babelify babel-preset-react

#add gulpfile
ADD . /runtime

CMD ["bash", "run.sh"]

/* gulpfile.js */

// Load some modules which are installed through NPM.
var gulp = require('gulp');
var browserify = require('browserify');  // Bundles JS.
var del = require('del');  // Deletes files.
var reactify = require('reactify');  // Transforms React JSX to JS.
var source = require('vinyl-source-stream');


// Define some paths.
var paths = {
  app_js: ['./src/js/app.js'],
  js: ['./src/js/*.js'],
};

// An example of a dependency task, it will be run before the css/js tasks.
// Dependency tasks should call the callback to tell the parent task that
// they're done.
gulp.task('clean', function(done) {
  del(['build'], done);
});


// Our JS task. It will Browserify our code and compile React JSX files.
gulp.task('js', function() {
  // Browserify/bundle the JS.
  console.log('trigger browserify');
  browserify(paths.app_js)
    .transform(reactify)
    .bundle()
    .pipe(source('bundle.js'))
    .pipe(gulp.dest('./src/'));
});

gulp.task('called', function(){
  console.log("Call");
})

// Rerun tasks whenever a file changes.
gulp.task('watch', function() {
  gulp.watch(paths.js, ['called','js']);
});

// The default task (called when we run `gulp` from cli)
gulp.task('default', ['watch', 'js']);

#!/usr/bin/bash
./node_modules/gulp/bin/gulp.js