Boost your Jekyll workflow with Grunt! Comes with cool features as livereload, sass, uglify, postcss and Git or FTP deploy. You can choose also your favourite front end framework and everything is automatic!

Usage no npm install needed!

<script type="module">
  import generatorJekyllRocks from '';


Generator Jekyll Rocks

npm license GitHub last commit GitHub issues npm

Boost your Jekyll workflow with Grunt!

Jekyll Rocks Generator uses the Yeoman technology to scaffold a basic Jekyll environment that in union with Grunt makes the perfect development workflow.

The Generator comes with cool featuresas livereload, sass, uglify, postcss and Git or FTP deploy. You could choose also to use a front end framework. At this time are available Bootstrap 4, Foundation 6, Semantic UI, Material Design Lite or Materialize. But you can obviously install whatever you want in a second time.


During setup you can choose:

Jekyll-Rocks always includes:

  • Automatic Jekyll and preprocessor compiling
  • An automatic build process that includes concatenation, image and svg optimization, CSS minification and JS uglification


To install this project, you'll need the following things installed on your machine.

  1. RubyGems - follow the guide.
  2. Jekyll - $ gem install jekyll bundler
  3. NodeJS - use the installer.

Getting Started

First, install Grunt and Bower using npm.

$ npm install -g grunt-cli
$ npm install -g bower

Second, install Yeoman and generator-jekyll-rocks.

$ npm install -g yo
$ npm install -g generator-jekyll-rocks

Then generate your new project:

$ yo jekyll-rocks

Grunt Workflow

Development mode

This will give you jekyll server, file watching, uglify, postcss, auto-rebuild etc.

You have to work only with app/ dir files.

You will find common jekyll server builded files under .jekyll/

$ grunt serve

Build mode

This will build your jekyll site minimizing all your sass, css, js, img and svg.

You could find the builded site under dist/

$ grunt build

Clear mode

This will clear all your tmp files, sass-cache etc.

$ grunt clear

Push mode

You can easily push your files on your branch master.

NOTICE: this command is available only if in the setup you choose it

$ grunt push

Push mode

You can easily deploy your site on your branch gh-pages, your ftp or both.

NOTICE: this command is available only if in the setup you at least one of these options.

$ grunt deploy

Getting To Know Yeoman

  • Yeoman has a heart of gold.
  • Yeoman is a person with feelings and opinions, but is very easy to work with.
  • Yeoman can be too opinionated at times but is easily convinced not to be.
  • Feel free to learn more about Yeoman.


MIT © Tommaso Negri