wax-cli

13 releases

0.2.1	Nov 10, 2022
0.2.0	Nov 6, 2022
0.1.10	Nov 5, 2022

#2501 in Parser implementations

MIT license

28KB
459 lines

Wax

_{HTML with Components}

Install

Install the Wax cli using cargo :

$ cargo install wax-cli

Useage

^{Create new project}

$ wax create <NAME>

^{Build your project}

$ wax build <PATH>

Project Structure

./<my-wax-site>/* 
  │
  ├─ .wax       - # Wax file cache
  ├─ dist       - # Wax build output
  │
  ├─ src/*      - # Your codebase (html, css, and js)
  │  ├─ lib/       - # Html wax components
  │  ├─ pages/     - # Your html pages
  │  └─ ...
  │
  └─ wax.toml   - # Wax config file

Static Components

Wax components are an extension of html.

^{Example : Component File}

~ src/lib/my-component.html

<p>
  Hello from my component ! :D
</p>

Importing / including wax components is done using the <wax!> tag.
e.g. <wax! … src="[path]" … >

^{Example : Importing}

~ src/routes/index.html

<body>
  …
  <wax! src="../lib/my-component.html" />
  …
</body>

Dynamic Components *

Passing parameters to a component is done using html attributes.
e.g. <wax! … [key]="[value]" … >

^{Example : Importing}

~ src/routes/index.html

<body>
  …
  <wax! src="../lib/my-component.html" title="My dynamic title" />
  …
</body>

Each component has to declare its parameters using <params! … [key] … >
Parameters can be inserted into the html using { [key] }

^{Example : Component File}

~ src/lib/my-component.html

<params! title>

<h1>
  { title }
</h1>

Config

^{* ? : means it is optional}

# wax.toml

[website]
pages = "RelativePath"  # Path to the directory containing your index.html.

[build]
minify = "Boolean?"     # If enabled, will minify the collapsed HTML files.

Testing

^{* Using the testing project in ./assets}

$ cargo run build ./assets

Dependencies

~15–28MB
~405K SLoC