jn88/bootstrap-starter

Bootstrap-Starter

Bootstrap-Starter be build base on the framework Twitter Bootstrap and integrated Font Awesome with latest version. Moreover Bootstrap-Starter help you resolve problems about: image sprite, svg sprite, layout responsive.

Featured Gulp Packages using

gulp-pug - Enables you to compile your Pug templates into HTML or JS. gulp-less - A LESS plugin for Gulp help you compile Less to CSS. browser-sync - Keep multiple browsers & devices in sync when building websites. gulp-plumber - Prevent pipe breaking caused by errors from gulp plugins. gulp-cssmin - Plugin to minify CSS, using clean-css. gulp.spritesmith - Generate an IMAGE (jpg, png) sprite sheet. Retina support. gulp-svg-sprites - Generate an SVG sprite sheet.

Install Project

I. Install Gulp

$ npm i -g gulp

II. Install the dependencies:

npm install

III. Install Bootstrap Intergrade Bootstrap

gulp install-bootstrap

Update Bootstrap latest version

gulp update-bootstrap

IV. Intergrade Font-Awesome Intergrade Font-Awesome:

gulp install-fa

Update Font-Awesome latest version:

gulp update-fa

Development

Run command below to work:

gulp watch

Build Dist

Create dist folder and dist.zip

gulp public

Preview Dist

gulp dist

Note

If you not use Font Awesome, gulp.spritesmith or gulp-svg-sprites please comment or remove Related codes to avoid error when you build project. Related files: gulpfile.js, style.less, main.less

bootstrap-starter's Issues

Integrate font-awesome like as optional

Ref: https://www.npmjs.com/package/font-awesome

Integrate font-awesome like as optional
to use or update font-awesome run command:
gulp update-fontawesome

Integrate gulp.spritesmith

Refer: https://www.npmjs.com/package/gulp.spritesmith
Integrate gulp.spritesmith to create sprite image

Integrade gulp-iconfont

Refer: https://www.npmjs.com/package/gulp-iconfont
It seem that good plugin to resolve build font icon, please try research it.

Cleaning up generated files automatically

Refer: https://css-tricks.com/gulp-for-beginners/#article-header-id-13
Since we're generating files automatically, we'll want to make sure that files that are no longer used don't remain anywhere without us knowing.