From 4ca869d89105e8700d1de8b4fda7df4d670f0572 Mon Sep 17 00:00:00 2001 From: David Kaltschmidt Date: Tue, 19 May 2015 15:19:20 +0200 Subject: [PATCH] Automated UI building - Add Dockerfile for js build image - Wire up dockerized-ui build to the makefile. - Removed unused dev tools from package.json/gulp --- .gitignore | 1 + Makefile | 23 +++++++++++------- README.md | 9 +++++++ circle.yml | 13 ++++++++++ client/.dockerignore | 2 ++ client/Dockerfile | 19 +++++++++++++++ client/gulpfile.js | 6 +---- client/package.json | 57 ++++++++++++++++++++++---------------------- 8 files changed, 88 insertions(+), 42 deletions(-) create mode 100644 client/.dockerignore create mode 100644 client/Dockerfile diff --git a/.gitignore b/.gitignore index cb71a89a63..156a2334c0 100644 --- a/.gitignore +++ b/.gitignore @@ -31,6 +31,7 @@ coverage.html # Project specific scope.tar +scope_ui_build.tar app/app probe/probe docker/app diff --git a/Makefile b/Makefile index bc8341c4bd..1661ab5e8f 100644 --- a/Makefile +++ b/Makefile @@ -1,4 +1,4 @@ -.PHONY: all build client static dist test clean +.PHONY: all static test clean # If you can use Docker without being root, you can `make SUDO= ` SUDO=sudo @@ -9,22 +9,29 @@ PROBE_EXE=probe/probe FIXPROBE_EXE=experimental/fixprobe/fixprobe SCOPE_IMAGE=$(DOCKERHUB_USER)/scope SCOPE_EXPORT=scope.tar +SCOPE_UI_BUILD_EXPORT=scope_ui_build.tar +SCOPE_UI_BUILD_IMAGE=weave/scope-ui-build all: $(SCOPE_EXPORT) -dist: client static $(APP_EXE) $(PROBE_EXE) -client: - cd client && make build && rm -f dist/.htaccess +$(SCOPE_UI_BUILD_EXPORT): client/Dockerfile client/gulpfile.js client/package.json + docker build -t $(SCOPE_UI_BUILD_IMAGE) client + docker save $(SCOPE_UI_BUILD_IMAGE):latest > $@ -app/static.go: - go get github.com/mjibson/esc +client/dist/scripts/bundle.js: client/app/scripts/* + mkdir -p client/dist + docker run -ti -v $(shell pwd)/client/app:/home/weave/app \ + -v $(shell pwd)/client/dist:/home/weave/dist \ + $(SCOPE_UI_BUILD_IMAGE) + +static: client/dist/scripts/bundle.js esc -o app/static.go -prefix client/dist client/dist test: $(APP_EXE) $(FIXPROBE_EXE) # app and fixprobe needed for integration tests go test ./... -$(APP_EXE): app/*.go app/static.go report/*.go xfer/*.go +$(APP_EXE): app/*.go report/*.go xfer/*.go $(PROBE_EXE): probe/*.go report/*.go xfer/*.go $(APP_EXE) $(PROBE_EXE): @@ -41,4 +48,4 @@ $(SCOPE_EXPORT): $(APP_EXE) $(PROBE_EXE) docker/Dockerfile docker/entrypoint.sh clean: go clean ./... - rm -f $(SCOPE_EXPORT) app/static.go + rm -rf $(SCOPE_EXPORT) $(SCOPE_UI_BUILD_EXPORT) client/dist diff --git a/README.md b/README.md index bf689203ec..07b12fc16b 100644 --- a/README.md +++ b/README.md @@ -47,6 +47,15 @@ To build a Docker container, make docker ``` +### The UI + +This repository contains a copy of the compiled UI. To build a fresh UI, run: + +``` +make scope_ui_build.tar +make static +``` + ## Running ### Manually diff --git a/circle.yml b/circle.yml index 774c804b70..f126861ed7 100644 --- a/circle.yml +++ b/circle.yml @@ -10,18 +10,31 @@ machine: GOPATH: /home/ubuntu:$GOPATH SRCDIR: /home/ubuntu/src/github.com/weaveworks/scope PATH: $PATH:$HOME/.local/bin + SCOPE_UI_BUILD: $HOME/docker/scope_ui_build.tar dependencies: + cache_directories: + - "~/docker" + override: + - if [[ -e "$SCOPE_UI_BUILD" ]]; then + docker load -i $SCOPE_UI_BUILD; + else + make scope_ui_build.tar; + mkdir -p $(dirname "$SCOPE_UI_BUILD"); + mv scope_ui_build.tar $(dirname "$SCOPE_UI_BUILD"); + fi post: - go get github.com/golang/lint/golint - go get github.com/fzipp/gocyclo - go get github.com/mattn/goveralls + - go get github.com/mjibson/esc - mkdir -p $(dirname $SRCDIR) - cp -r $(pwd)/ $SRCDIR test: override: - cd $SRCDIR; ./bin/lint . + - cd $SRCDIR; make static - cd $SRCDIR; make - cd $SRCDIR; ./bin/test post: diff --git a/client/.dockerignore b/client/.dockerignore new file mode 100644 index 0000000000..f06235c460 --- /dev/null +++ b/client/.dockerignore @@ -0,0 +1,2 @@ +node_modules +dist diff --git a/client/Dockerfile b/client/Dockerfile new file mode 100644 index 0000000000..9ec183c6f2 --- /dev/null +++ b/client/Dockerfile @@ -0,0 +1,19 @@ +FROM mhart/alpine-node + +WORKDIR /home/weave + +# build tool +RUN npm install -g gulp + +# install app and build dependencies +ADD package.json /home/weave/ +RUN npm install + +ADD gulpfile.js /home/weave/ + +# run container via +# +# `docker run -v $GOPATH/src/github.com/weaveworks/scope/client:/app weaveworks/scope-build` +# +# after the container is run, bundled app should be in ./dist/ dir +CMD gulp build diff --git a/client/gulpfile.js b/client/gulpfile.js index 747cd0dcbb..c443f086e5 100644 --- a/client/gulpfile.js +++ b/client/gulpfile.js @@ -47,8 +47,6 @@ gulp.task('scripts', function() { gulp.task('html', ['styles', 'scripts'], function () { return gulp.src('app/*.html') .pipe($.preprocess()) - //.pipe($.useref.assets({searchPath: 'dist'})) - //.pipe($.useref()) .pipe(gulp.dest('dist')) .pipe($.size()) .pipe(livereload()); @@ -107,9 +105,7 @@ gulp.task('connect', function () { }); }); -gulp.task('serve', ['connect', 'styles', 'scripts', 'fonts'], function () { - //require('opn')('http://localhost:9000'); -}); +gulp.task('serve', ['connect', 'styles', 'scripts', 'fonts']); gulp.task('watch', ['serve'], function () { livereload.listen(); diff --git a/client/package.json b/client/package.json index a7943cf451..cb3b71d28c 100644 --- a/client/package.json +++ b/client/package.json @@ -1,53 +1,52 @@ { - "name": "scope-webapp", - "version": "0.2.0", + "name": "weave-scope", + "version": "1.2.0", + "description": "SPA JS app for Weave Scope visualising the application network.", + "repository": "weaveworks/scope", + "license": "Apache-2.0", + "private": true, "dependencies": { - "d3": "^3.5.3", - "dagre": "^0.7.1", - "flux": "^2.0.1", + "d3": "^3.5.5", + "dagre": "^0.7.2", + "flux": "^2.0.3", "font-awesome": "^4.3.0", "keymirror": "^0.1.1", - "lodash": "~3.0.1", + "lodash": "~3.8.0", "material-ui": "^0.7.5", "object-assign": "^2.0.0", - "page": "^1.6.0", - "react": "^0.13.2", + "page": "^1.6.3", + "react": "^0.13.3", + "react-tap-event-plugin": "^0.1.6", "react-tween-state": "0.0.5", "reqwest": "~1.1.5" }, "devDependencies": { - "browserify": "^8.1.3", - "connect": "^3.3.4", + "browserify": "^10.2.0", "del": "^1.1.1", - "gulp": "^3.8.10", - "gulp-autoprefixer": "^2.1.0", - "gulp-cache": "^0.2.4", - "gulp-clean": "^0.3.1", + "gulp": "^3.8.11", + "gulp-autoprefixer": "^2.3.0", "gulp-connect": "^2.2.0", "gulp-csso": "^1.0.0", - "gulp-filter": "^2.0.0", + "gulp-filter": "^2.0.2", "gulp-flatten": "^0.0.4", "gulp-if": "^1.2.5", - "gulp-imagemin": "^2.1.0", - "gulp-jshint": "^1.9.2", + "gulp-jshint": "^1.10.0", "gulp-less": "^3.0.3", "gulp-livereload": "^3.8.0", - "gulp-load-plugins": "^0.8.0", + "gulp-load-plugins": "^0.10.0", "gulp-preprocess": "^1.2.0", - "gulp-size": "^1.2.0", - "gulp-sourcemaps": "^1.3.0", - "gulp-uglify": "^1.1.0", - "gulp-useref": "^1.1.1", - "gulp-util": "^3.0.3", - "jshint-stylish": "^1.0.0", - "opn": "^1.0.1", - "proxy-middleware": "^0.11.0", - "reactify": "^1.1.0", + "gulp-size": "^1.2.1", + "gulp-sourcemaps": "^1.5.2", + "gulp-uglify": "^1.2.0", + "gulp-util": "^3.0.4", + "jshint-stylish": "^1.0.2", + "proxy-middleware": "^0.11.1", + "reactify": "^1.1.1", "vinyl-buffer": "^1.0.0", - "vinyl-source-stream": "^1.0.0" + "vinyl-source-stream": "^1.1.0" }, "scripts": { - "start": "npm install && gulp serve" + "start": "gulp" }, "engines": { "node": ">=0.10.0"