Bare minimum boilerplate featuring Gulp, multipage Pug templating and PostCSS styling, all live-reloadable.
- gulp as a builder
- Pug templates
- PostCSS with csso minification and include-import enabled
- Browsersync live-reloading preview
- Prettier project-specific editor settings
Clone this repository:
git clone https://github.com/icmx/just-gulp
Go to local saved copy:
cd just-gulp
Install dependencies:
npm install
Launch it on localhost:1337 — happy coding!
npm run watch
Build it:
npm run build
All sources are in src
directory, but any path can be easily changed in gulpfile.js.
assets
— almost-compiled binary files like images, icon sets, fonts etc. By default it contains onlyimages
subdirectory which have its own gulp task. If you want to use other asssets, you have to create a new directory and write another task by yourself.static
— ready and compiled files, like favicons, robots.txt etc.pages
— additional pages, layouts and other Pug filesscripts
— additional scripts and other JS filesstyles
— additional styles and other CSS filesindex.pug
— pages index fileindex.js
— scripts index fileindex.css
— styles index file
By default, gulp will watch for index.*
files and its corresponding directories, e.g. for index.js
and scripts/**/*.js
files. All files will be bundled into single HTML, CSS and JS bundles, while assets and static files will be just copied:
Sources (src ) |
Output (dist ) |
---|---|
assets/* |
/assets/* |
static/* |
/* |
pages , index.pug |
/index.html |
scripts (optional), index.js |
/main.min.js |
styles (optional), index.css |
/style.min.css |
There are lots of similar boilerplates already indeed. However, most of them are incredibly bloated by endless dependencies, which may be deprecated, outdated and not even used at all, thus I suppose there should be some really lightweight and easy to use alternative.
Please note that packages choice for Just Gulp not only bare, but also sane: modern and feature-rich browser-sync
instead of outdated gulp-livereload
for instance, same for webpack-stream
and so on.
- Just Webpack — same project, but Webpack-based.
- Just Monorepo — minimal monorepository boilerplate built with NPM workspaces