diff --git a/README.md b/README.md index eb90a466..7fa7c0f7 100644 --- a/README.md +++ b/README.md @@ -37,6 +37,9 @@ You can rebuild swagger-ui on your own to tweak it or just so you can say you di 2. `npm run build` 3. You should see the distribution under the dist folder. Open [`./dist/index.html`](./dist/index.html) to launch Swagger UI in a browser +### Development +Use `npm run build` to make a new build and `npm run serve` to start web server that will serve `dist` directory, watches for changes in files and reloads the page. + ### Build using Docker To build swagger-ui using a docker container: diff --git a/gulpfile.js b/gulpfile.js index 6ad52239..d7920653 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -12,6 +12,8 @@ var less = require('gulp-less'); var handlebars = require('gulp-handlebars'); var wrap = require('gulp-wrap'); var declare = require('gulp-declare'); +var watch = require('gulp-watch'); +var connect = require('gulp-connect'); /* * Clean ups ./dist folder @@ -31,7 +33,7 @@ function templates() { return gulp .src(['./src/main/template/**/*']) .pipe(handlebars()) - .pipe(wrap('Handlebars.template(/*__DEFINING__*/<%= contents %>)')) + .pipe(wrap('Handlebars.template(<%= contents %>)')) .pipe(declare({ namespace: 'Handlebars.templates', noRedeclare: true, // Avoid duplicate declarations @@ -64,7 +66,8 @@ gulp.task('dist', ['clean'], function() { .pipe(uglify()) .pipe(rename({extname: '.min.js'})) .on('error', gutil.log) - .pipe(gulp.dest('./dist')); + .pipe(gulp.dest('./dist')) + .pipe(connect.reload()); }); /* @@ -79,14 +82,15 @@ gulp.task('less', ['clean'], function() { ]) .pipe(less()) .on('error', gutil.log) - .pipe(gulp.dest('./src/main/html/css/')); + .pipe(gulp.dest('./src/main/html/css/')) + .pipe(connect.reload()); }); /* * Copy lib and html folders */ -gulp.task('copy', ['clean'], function() { +gulp.task('copy', ['less'], function() { // copy JavaScript files inside lib folder gulp @@ -101,5 +105,25 @@ gulp.task('copy', ['clean'], function() { .on('error', gutil.log) }); +/* + * Watch for changes and recompile +*/ +gulp.task('watch', function() { + return watch(['./src/**/*.{coffee,js,less}'], function() { + gulp.start('default'); + }); +}); -gulp.task('default', ['dist', 'less', 'copy']); +/* + * Live reload web server of `dist` +*/ +gulp.task('connect', function() { + connect.server({ + root: 'dist', + livereload: true + }); +}); + + +gulp.task('default', ['dist', 'copy']); +gulp.task('serve', ['connect', 'watch']) diff --git a/package.json b/package.json index a6d287f2..107e2e2e 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,7 @@ "description": "Swagger UI is a dependency-free collection of HTML, Javascript, and CSS assets that dynamically generate beautiful documentation from a Swagger-compliant API", "scripts": { "build": "./node_modules/gulp/bin/gulp.js;", + "serve": "./node_modules/gulp/bin/gulp.js serve;", "test": "./node_modules/gulp/bin/gulp.js; ./node_modules/mocha/bin/mocha src/test/e2e/index.js" }, "repository": { @@ -19,7 +20,6 @@ "readmeFilename": "README.md", "dependencies": {}, "devDependencies": { - "swagger-client": "2.1.0-alpha.7", "chai": "^1.10.0", "cors": "2.1.1", "docco": "0.4.x", @@ -29,16 +29,19 @@ "gulp-clean": "^0.3.1", "gulp-coffee": "^2.2.0", "gulp-concat": "^2.4.3", + "gulp-connect": "^2.2.0", "gulp-declare": "^0.3.0", "gulp-handlebars": "^3.0.1", "gulp-less": "^2.0.1", "gulp-rename": "^1.2.0", "gulp-uglify": "^1.1.0", "gulp-util": "^3.0.2", + "gulp-watch": "^4.1.0", "gulp-wrap": "^0.10.1", "http-server": "^0.7.4", "less": "~1.4.2", "mocha": "^2.1.0", - "selenium-webdriver": "^2.44.0" + "selenium-webdriver": "^2.44.0", + "swagger-client": "2.1.0-alpha.7" } }