Jekpack Star

Getting Started


$ npm install -g @bincode/jekpack # or yarn global add @bincode/jekpack

Create a project

$ jekpack new hello-world

Install the dependencies

$ cd hello-world
$ jekpack bundle

Start Dev Servers

$ jekpack dev

Jekyll and Webpack are working together now. All you need to know is only follow the Jekyll rules to code everything inside the src folder. Read Jekyll Documentation for more details, if you are not familiar with it.

All files located at assets folder are managed by webpack. For all files named main.js(inside assets/javascripts) and main.scss(inside assets/stylesheets) will be considered as entry files, these files will be pack via webpack. In HTML, include these files via {% asset_tag main.css %}, {% asset_tag main.js%}. For example, a file located at src/assets/stylesheets/some/page/main.scss can be included via:

{% asset_tag some/page/main.css %} 

Build Distribution

$ jekpack build

the default output location is ./dist

Deploy to S3

$ jekpack deploy your-bucket-name

If you plan take S3 as website hosting. This command is helpful for you. Be sure the environment variables AWS_ACCESS_KEY_ID and AWS_SECRET_ACCESS_KEY are set already before you run the command.

For make life easier, you can create a file with name .env, which contains the following:


These environment variables will be loaded at the beginning of jekpack commands.

If you use CloudFront along with S3, the argument --cloud-front-id can be used to create invalidations.

jekpack deploy your-bucket-name --cloud-front-id your-cloud-front-id