You can add pages in the 📁 pages directory, and your templates files should be located in 📁 layouts and 📁 components directory, but that's up to you - 📁 templates is ok too.
Here is an example of how to use Liquid as a template engine inside the pages directory:
*.liquid- classic liquid template file,
.liquid.jsonfile with the same name can be added to add data to the template
*.json.liquid- for non-html data such as json.
liquidis input and
jsonis output (as a
.jsonfile) - you can use this if you have custom tag or function that transforms
*.json- for defining a page only with data, template is auto-loaded from the
templateproperty inside the file, or from plugin config, or from 📁 data directory inside a
.jsonfile (and you can add other shared data for all your templates here)
The same goes for any other template engine, just change the
.liquid to something else. You can even use more template engines at the same time.
Only one template engine can be used as
*.json at the same time though. If you have more than one template engine, you need to add
format property into
*.json so plugins can tell which template engine should be rendered, otherwise it's the first defined plugin.
See Plugins to learn more how to configure the plugins.
See Trying Vituum Online for various examples of template engines
Create your own plugin
Vituum can be used with any template engine plugin made for Vite.
Vite doesn't support ext-names for template engine by default. That's why Vituum uses internal API to change file names before and after build via Vite plugin API so templates are treated as
.html files during build.
You can use the same internal API for your own plugin or make your own.
Additionally, each plugin uses Vite middleware to support urls without ext-names in Vite Dev Server.