Wikity is a tool that allows you to use Wikitext (used by Wikipedia, Fandom, etc) as a templating language to create HTML pages.
This package comes with built-in support for compilation using Eleventy.
See the example folder for a template on making your own wiki site!
Wikity is available on npm. Install locally to use in a Node package or install globally for use from the command-line.
| Local install | Global install |
|---|---|
npm install wikity | npm install -g wikity |
-
wikity.compile(folder?: string, options?: object): void- Compile all Wikitext (
.wiki) files from an input folder (defaults to the current directory,.) into HTML.
- Compile all Wikitext (
-
wikity.parse(input: string, options?: object): string- Parse raw wikitext input into HTML.
-
Options:
eleventy: boolean = false- Whether front matter will be added to the outputted HTML for Eleventy to read (default:
false). (This parameter must be set totrueif you want to use this with Eleventy.)
- Whether front matter will be added to the outputted HTML for Eleventy to read (default:
outputFolder: string- Used only with
compile(). - Where outputted HTML files shall be placed.
- Default:
'wikity-out'.
- Used only with
templatesFolder: string- What folder to place templates in.
- Default:
'templates'.
imagesFolder: string- What folder to place images in.
- Default:
'images'.
defaultStyles: boolean- Used only with
compile(). - Whether to use default wiki styling.
- Default: to
truewhen called fromcompile()andfalsewhen called fromparse().
- Used only with
customStyles: string- Used only with
compile(). - Custom CSS styles to add to the wiki pages.
- Default: empty (
'').
- Used only with
const wikity = require('wikity'); // compile all .wiki files inside this directory wikity.compile(); // parse wikitext from an input string let html = wikity.parse(`'''bold''' [[link|text]]`); // <b>bold</b> <a href="link"...>text</a>Use Wikity along with Eleventy to have all your wiki files compiled during the build process:
// .eleventy.js (eleventy's configuration file) const wikity = require('wikity'); module.exports = function (eleventyConfig) { const rootFolder = 'src'; const templatesFolder = 'templates', imagesFolder = 'images'; // defaults; relative to root folder const outputFolder = 'wikity-out'; // default const wikityOptions = { eleventy: true, templatesFolder, imagesFolder, outputFolder }; const wikityPlugin = () => wikity.compile(rootFolder, wikityOptions); eleventyConfig.addPlugin(wikityPlugin); eleventyConfig.addPassthroughCopy({ 'src/images': 'wiki/' + imagesFolder }); // Eleventy does not pass through images by default }The above will use the following file structure (with some example wiki files given):
src/templates/: Directory for wiki templates (called like{{this}})images/: Directory to place images (called like[[File:this]])Index.wiki: Example fileOther_Page.wiki: Example other file
wikity-out/: File templates compiled from the.wikifiles (add this to.gitignore)wiki/: Output HTML files compiled fromwikity-out/(add this to.gitignore)
(View the above starting at the URL path /wiki/ when ran in an HTTP server.)
$ wikity help Display a help message $ wikity compile [<folder>] [-o <folder>] [-t <folder>] [-e] [-d] Compile Wikity with various options $ wikity parse <input> Parse raw input into HTML $ wikity version Display the latest version of WikityUse Wikitext (file extension .wiki) to create your pages.
Any wiki templates (called using {{template name}}) must be inside the templates/ folder by default. Any files must be inside the images/ folder by default. Your wikitext (*.wiki) files go in the root directory by default.
| Markup | Preview |
|---|---|
'''bold''' | bold |
''italic'' | italic |
'''''bold italic''''' | bold italic |
``code`` | code |
```code block``` | code block |
=heading= | heading |
==subheading== | subheading |
*bulleted |
|
**sub-bulleted |
|
#numbered |
|
##sub-numbered |
|
;term | |
:definition | |
<ref>Text</ref> | [1] |
<references/> | 1. ↑ Text |
[[internal link]] | internal link |
[[link|display text]] | display text |
[external-link] | [1] |
[external-link display text] | display text |
[[File:Example.png|Caption.]] | ![]() |
{{tp name}} | (contents of templates/tp_name.wiki) |
{{tp name|arg=val}} | (ditto but {{{arg}}} is set to 'val') |
{{{arg}}} | (value given by template) |
{{{arg|default val}}} | (ditto but 'default val' if unset) |
{| style="margin:1em" | table opening |
! Cell heading | Cell heading |
|- class="new-row" | new table row |
| Cell content | Cell content |
|} | table closing |
{{#if:non-empty-string|text}} | text |
{{#ifeq:1|2|true|false}} | false |
{{#vardefine:varname|text}} | (saved to memory) |
{{#var:varname}} | text (from memory) |
{{#var:varname|default val}} | (ditto but 'default val' if unset) |
{{#switch:a|a=1|b=2|c=3}} | 1 |
{{#time:dd/mm/yy|2021-03-28}} | 28/03/21 |
{{#lc:TEXT}} | text |
{{#ucfirst:text}} | Text |
{{#len:12345}} | 5 |
{{#sub:string|2|4}} | ring |
{{#pos:text|x}} | 2 |
{{#padleft:text|5|_}} | _text |
{{#padright:msg|5|_}} | msg__ |
{{#replace:Message|e|3}} | M3ssag3 |
{{#explode:A-B-C-D|-|2}} | C |
{{#urlencode:t e x t}} | t%20e%20x%20t |
{{#urldecode:a%20b%27c}} | a b'c |
{{#ev:youtube|dQw4w9WgXcQ}} | (YouTube embed) |
<noinclude>No</noinclude> | (blank outside a template) |
<onlyinclude>Yes</onlyinclude> | Yes |
<includeonly>Yes</includeonly> | Yes (blank inside a template) |
<nowiki>[[no link]]</nowiki> | [[no link]] |
