A starter kit using only npm scripts for Jekyll static websites

When I originally started using Jekyll, I used Gulp JS for my build system. During a discussion with a colleague, he told me that I could achieve the similar functionality by using npm scripts alone. I decided to try and replace my Gulpfile with npm scripts alone.

Out of this conversation came Jekyll Starter Kit, which is a project boilerplate with configurable tools for static site development. These tools provide synchronized cross-device testing with a focus on performance. This is a good starting point for developers who want to build a Jekyll site with fewer layers of abstraction in their tooling.

How it Works

Below is a snippet of the package.json file. With NPM run scripts, you can define strings which will be run on the command line when you invoke the script. For example, you could have a script called “build” that runs other commands. You can also run any Unix or Windows command in the package.json file!


{
  "name": "jekyll-starter-kit",
  "version": "1.0.0",
  "description": "jekyll, asset build using npm scripts",
  "main": "src/scripts/main.js",
  "scripts": {
    "build:jekyll": "jekyll build --config _config.yml,_config-dev.yml",
    "build:js": "npm run eslint && npm run uglify",
    "build:css": "npm run sass && npm run prefix",
    "build:font": "npm run font",
    "build:images": "npm run imagemin",
    "build": "npm run clean && npm run build:js && npm run build:css
              && npm run build:jekyll && npm run critical"
  }
}

Performance

Jekyll Starter Kit strives to give you a high-performance starting point out of the box. By default, your project will have a 99/100 on PageSpeed Insights. You will need to add caching on your server (8 days recommended) to bring it to 100/100.

 

Comments are closed