cheki-html

"cheki-html" is a CLI tool for converting Nunjucks + SCSS documents to PNG Images.

DEMO

"cheki-html" and your nunjucks + scss documents can generate the images like:

Features

This tool was originally designed to generate images like chat apps' screenshots in the text-based and semi-automatic way.

Abstracting from that idea, this tool is now able to semi-automatically generate stylized images using nunjucks and scss.

Requirements

• Node.js >= 18.12.1
• npm >= 8.19.2

node --version
# 19.5.0

npm --version
# 9.3.1

Installation

You can install "cheki-html" with "npm" command:

npm install -g cheki-html

Or, you can install it locally:

cd <your-local-project>

npm install cheki-html
# then, you have to execute "cheki-html" with "npx" command;
# e.g.) npx cheki-html build

Usage

"cheki-html" has 4 subcommands (help, init, preview, build), and each subcommand has their options.

cheki-html <subcommand> [options]

1. Preparing default template.

mkdir <empty-directory>
cd <empty-directory>

cheki-html init

2. Edit the template.

nano example.njk
# or add some html/nunjucks files (.html/.njk)

nano assets/css/chat.scss
# or add some css/scss/sass files (.css/.scss/.sass)

3. Preview your template.

cheki-html preview

Open your browser, and access http://localhost:8080/preview

4. Build your template.

cheki-html build

You can find the generated screenshots in the "output" directory.

Note

I don't test under Linux and Windows.

Author

• M4K-15Y-6666-FK

• GitHub

• OFUSE

• Email

Donate

OFUSE

Here, you can send messages and view the progress of my works (not only programs; novel, music, or etc.)

Of course, you can just donate to me.

License

"cheki-html" is under MIT license.

Feel free to use the generated screenshots for your commercial projects !

But, be careful of the license of the images used in default template (e.g., when you use the images seperately from this program). See input/assets/img/LICENSE