Jekyll starter project including full setup for gulp, Sass, Autoprefixer, Browserify, imagemin, Browsersync, PostCSS etc.
To use this starter project, you'll need the following things installed on your machine. Jekyll & Bundler
$ gem install jekyll bundler
Nodejs user the installer, Homebrew, etc.
Clone this repo, or download it into a directory of your choice.
$ git clone https://github.com/nathanhenniges/jekyll-boilerplate.git
Inside the directory, run npm install
.
$ cd jekyll-boilerplate
$ npm install
Note: If you have trouble with the commands, prepending bundle exec
to your
commands may solve it. e.g.
$ bundle exec npm start
This will give you file watching, browser synchronisation, auto-rebuild, CSS injecting, etc.
$ npm start
This will set the JEKYLL_ENV
to production
and use the production config file(s)
set in mrdemonwolf.config.js
to override default settings.
$ npm run build
This will display all available commands.
$ npm run
As this is just a Jekyll project, you can use any of the commands listed in their docs
You can change the configurations by editing mrdemonwolf.config.js
default: 4000
options: integer
Tasks to run when you exec npm start
or gulp
commands.
-
Imagemin To minify images. default:
true
options: boolean (true
/false
) -
sass To compile Sass. default:
true
options: boolean (true
/false
) -
server To compile sources via Jekyll and to keep browsers in sync with file changes via Browsersync. default:
true
options: boolean (true
/false
)
Settings related to the paths.
-
dest The destination directory for the whole project. default:
"_site"
options: string -
posts The directory of posts source files. default:
"_posts"
options: string -
assets The directory to gather all assets. default:
"./assets"
options: string -
css The CSS desination directory for Sass. default:
"css"
options: string example:"stylesheets"
-
js The JavaScript destination directory for Browserify default:
"js"
options: string example:"javascripts"
-
images The destination directory of compressed image files for imagemin. default:
"images"
options: string example"img"
-
sass The directory of Sass files. default:
"_sass"
options: string example:"src/sass"
-
jsSrc The directory of JavaScript source files to bundle up by Browserify. default:
"_js"
options: string example:"src/js"
-
imagesSrc The directory of image source files to compress. default:
"_images"
options: string example:"src/images"
Jekyll settings.
Jekyll config files.
-
default The default Jekyll config file(s). default:
"_config.yml"
options: string ("FILE1[,FILE2,...]"
) example:"_config1.ym,_config2.yml"
-
development Development mode config file(s) to override default settings. default:
""
options: string("FILE1[,FILE2,...]"
) example:"_config_development"
-
production Production mode config file(s) to override default settings. default:
""
options: string("FILE1[,FILE2,...]"
) example:"_config_production"
Sass settings.
- outputStyle
Teh output style of Sass.
default:
"compressed"
options:"expanded"
,"nested"
,"compact"
,"compressed"
Autoprefixer settings
- browsers
List of browsers, which are supported in your theme.
default:
["> 1%", "last 2 versions", "Firefox ESR"]
options: array. See Browserslist docs for available queries. example:["> 5%", "last 2 versions", "IE 8"]
JavaScript settings.
- entry
File name(s) of JavaScript entry points.
default:
["main.js"]
options: array example:["pluginA.js", "pluginB.js", "main.js"]
Copyright 2018 Nathan Henniges. Code released under the MIT license.