For examples and more information, see the github page at cjmosure.github.io/gulp-template. There is also a react.js version of this as a branch: github.com/cjmosure/gulp-template/tree/react.
- Use Bower for front-end package management
- Compile SASS & Integrate frameworks (Bootstrap 4 included)
- Concatenate and minify CSS with sourcemaps
- Concatenate and minify Javascript plugins
- Create a lightweight webserver for local development
- Generally make your development experience more streamlined and productive! :)
- You need to have node.js & npm installed on your local machine (Download Here)
- Clone this repo:
git clone https://github.com/cjmosure/gulp-template.git
- Run
npm install
orsudo npm install
if it barks errors at you - Run
bower install
to get dependencies (jquery, angular, bootstrap - see the bower.json file) - Run
gulp
to run the gulp tasks - Webserver: Run
gulp serve
to open a light webserver and watch for CSS or Javascript changes. URL will automatically open, usually as http://localhost:8000 - Browsersync (using another webserver: docker, vagrant, mamp, etc): Add your development url to the
./assets/manifest.json
devUrl to use BrowserSync. Rungulp watch
to watch for CSS or Javascript changes and compile automatically (control+C to stop watching)
Not popular enough to warrant releases, but maybe in the future. See the commits for history of changes / additions.
Christopher J. Mosure cj@webmachine.io
- BrowserSync
- asset builder for scripts
- asset builder for sass + bootstrap
- wiredep bower packages
- lazypipes for css and script tasks
- lazypipes for js tasks
- variable declaration for styles files and paths
- add banners to minified files
- separate main.css (with source maps), main.min.css
- compress images and add to dist
- karma tests for scripts
- gulp server
- github page
Do whatever you'd like...