- Support ES6、Sass(Compass)、Hbs
- Support livereload
$ sudo npm install
It use gulp to compress , minify , open server, build system. ( The html's template is handlebars )
build sass , js , hbs , open a server(port: 8000
), then watch
$ gulp
minify css , js, html, compress img
$ gulp minify
concate ./src/*.css
file to ./lib/library.min.css
file , reduce request (So do .js)
$ gulp concate-css
$ gulp concate-js
sass / scss code (import normalize.css
initially)
- input : sass /
- output : dist / css /
puts js (ES6) code
- input : js /
- output : dist / js
minify's code (css , js , img , bgm)
some library code ( js , css ) ex: jQurty
minify's library code
hbs template ( include partial )
control the data to transform hbs's template. Look gulp-hbs-router
const hbsRouter = {
index: {
author: '',
description: '',
website: 'www.sample.com.tw',
website_name: 'Gulp-Frontend-Start!',
keywords: '',
first_meet: 'This is index.html!!',
},
};
module.exports = hbsRouter;
controll partial hbs. Look gulp-hbs-router
control gulp
a config.rb for compass
MIT © TseHang