Pakku | パック

A Command-line application for packing web sites and applications into a directory full of goodness and performance improvements.

What does it do?

• Searches through your whole web site/application, looking for assets, links, pages, images, and what not.
• Offers helper functions to improve your development.
• Replaces them with versionized names using last Git commit Id — Bye bye “Please clean your browser cache!”
• Optmise and minify all things! (HTML, Javascript, CSS, Less, JPG, GIF, PNG, SVG)
• A flavoursome directory files will be created with all the nifty files inside.

Installation

Install this command via npm through:

npm install pakku

(standard -g -S flags apply depending on your needs)

Usage

While in the project directory, run:

pakku <path-to-index-page> <output-dir>

Please notice that the output directory is removed and re-created for every build/command ran, so choose wisely before deleting something you don't want to.

Now sit back, relax, and watch the magic happen.

Helpers

I have created a few helpers which are here to enchance development experience, for now they are:

HTML

• data-dev: Every tag having this attribute will be stripped out of your build.
• data-inline: Instead of update the file name reference it will instead, replaced with the expanded and minfied file contents.
  • <link rel=stylesheet href=main.css> becomes <style>...main.css contents...</style>
  • <script src=main.js></script> becomes <script>...main.js contents...</script>

Javascript

• Strings with filenames prefixed with @ will be expanded and inlined. i.e: var src = '@main.html';

Bugs

You will probably find a lot of it. It still in early development (0.x.x), but you are more than welcome to fill a bug report letting me know how things are or aren't working for you. I appreciate your time to contribute to the project for a better future.

License

MIT and new BSD.