Jekyll starter project including full setup for Gulp, Sass, Autoprefixer, Bourbon/Neat/Bitters, Browserify, Imagemin, Browsersync, etc.
- Gulp
- Sass
- Autoprefixer
- Bourbon/Neat/Bitters
- Browserify
- Watchify
- UglifyJS
- Imagemin
- Browsersync
Bourbon is a lightweight Sass framework. If you don't use it, it will do nothing to your CSS file.
To use this starter project, you'll need the following things installed on your machine.
- Clone this repo, or download it into a directory of your choice.
- Inside the directory, run
npm install.
This will give you file watching, browser synchronisation, auto-rebuild, CSS injecting, etc.
$ npm startOr, if you have installed Gulp globally, this is also available and is same as npm start.
$ gulpThis will set the JEKYLL_ENV to production and use the production config file(s) set in gulpconfig.json to override default settings.
$ npm run build-productionThis will display all available commands.
$ npm runAs this is just a Jekyll project, you can use any of the commands listed in their docs
You can change the configurations by editing gulpconfig.json
default: 4000
options: integer
Tasks to run when you exec gulp command.
To use Browserify.
default: true
options: boolean (true / false)
To minify images.
default: true
options: boolean (true / false)
To compile Sass.
default: true
options: boolean (true / false)
To compile sources via Jekyll and to keep browsers in sync with file changes via Browsersync.
default: true
options: boolean (true / false)
To watch files and run tasks on file changes.
Settings about paths.
The destination directory for the whole project.
default: "_site"
options: string
The directory of posts source files.
default: "_posts"
options: string
The directory to gather all assets.
default: "./assets"
options: string
example: "./" (directly under the theme direcotry)
The CSS destination directory for Sass.
default: "css"
options: string
example: "stylesheets"
The JavaScript destination directory for Browserify.
default: "js"
options: string
example: "javascripts"
The destination directory of compressed image files for Imagemin.
default: "images"
options: string
example: "img"
The directory of Sass files.
default: "_sass"
options: string
example: "src/sass"
The directory of JavaScript source files to bundle up by Browserify.
default: "_js"
options: string
example: "src/js"
The directory of image source files to compress.
default: "_images"
options: string
example: "src/images"
Jekyll settings.
Jekyll config files.
The default Jekyll config file(s).
default: "_config.yml
options: string ("FILE1[,FILE2,...]")
example: "_config1.yml,_config2.yml
Development mode config file(s) to override default settings.
default: ""
options: string ("FILE1[,FILE2,...]")
example: "_config_development"
Production mode config file(s) to override default settings.
default: ""
options: string ("FILE1[,FILE2,...]")
example: "_config_production"
Sass settings.
The output style of Sass.
default: "compressed"
options: "expanded", "nested", "compact", "compressed"
Autoprefixer settings.
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.
File name(s) of JavaScript source file(s).
default: ["main.js"]
options: array
example: ["pluginA.js", "pluginB.js", "main.js"]
The distribution JavaScript file name.
default: "main.js"
options: string
example: "script.js"
Copyright © 2015-2016 the contributors of the Frasco project under the MIT License.