A boilerplate for building web projects with Gulp. Uses Gulp 4.x.
Features
- Concatenate, minify JavaScript.
- Minify,Clean CSS .
- Optimize Images.
- Copy static files and folders into your
dist
directory. - Watch for file changes, and automatically recompile build and reload webpages.
Note: if you've previously installed Gulp globally, run npm rm --global gulp
to remove it. Details here.
Make sure these are installed first.
- Node.js
- Gulp Command Line Utility
npm install --global gulp-cli
- In bash/terminal/command line,
cd
into your project directory. - Run
npm install
to install required files and dependencies. - When it's done installing, run one of the task runners to get going:
gulp
manually compiles files.gulp watch
automatically compiles files and applies changes using BrowserSync when you make changes to your source files.
Add your source files to the appropriate src
subdirectories. Gulp will process and and compile them into dist
.
- JavaScript files in the
src/js
directory will be compiled todist/js
. Files in subdirectories under thejs
folder will be concatenated. For example, files injs/detects
will compile intodetects.js
. - Files in the
src/css
directory will be compiled todist/css
. - Images files placed in the
src/img
directory will be optimized compiled intodist/img
. - Files and folders placed in the
html
directory will be copied as-in into thedist
directory.