Reshape Standard Plugin Pack
A standard, opinionated plugin pack for reshape
Note: This project is in early development, and versioning is a little different. Read this for more details.
Installation
npm install reshape-standard -S
Note: This project is compatible with node v6+ only
Example
The standard plugin pack includes plugins that cover all the features needed from a modern template engine. Below is an example of a page utilizing many of the features:
doctype htmlhtml head title Standard Example body h1 Hello world! ul#nav li.active: a(href='#') home li: a(href='#') about include(src='_welcome_message.sgr') p local variable: {{ foo }} each(loop='item of items') if(condition='item.name') p {{ item.name }} else p item with no name! p(mdi) **Look** at this [markdown](https://daringfireball.net/projects/markdown/)
Note that it is easily possible to configure any of the options. If you don't like the whitespace syntax, you can flip it off with parser: false
and use the same features with standard <html>
syntax. If you don't like the {{ }}
delimiters, you can quickly and easily change them. See the options below for more!
Usage
This is nothing more than a light wrapper around a reshape configuration object. Options are filtered into their appropriate plugins internally. All are optional.
const reshape = const standard =
By default, the standard plugin pack includes:
- sugarml, provided as default parser
- reshape-expressions, default settings
- reshape-layouts, default settings
- reshape-include, default settings
- reshape-content with
md
andmdi
functions that render markdown using markdown-it - reshape-retext with the smartypants plugin
- reshape-beautify, default settings
- reshape-minify, toggled with the
minify
option which is false by default. When enabled, it will disablebeautify
Based on the way they are ordered there are a couple limitations to keep in mind:
- You cannot use a layout
block/extend
inside of aninclude
- Any expression delimiters rendered from a
content
orretext
transform will be output as plaintext, not as an expression - Output from a
content
transform will be processed byretext
in that order
Any of these plugins can be customized by passing options described below.
Options
Name | Description | Default |
---|---|---|
root | Root path used to resolve layouts and includes | |
filename | Name of the file being compiled, used for error traces and as the include/layout root if not otherwise provided | |
delimiters | Delimiters used for html-escaped expressions | ['{{', '}}'] |
unescapeDelimiters | Delimiters used for unescaped expressions | ['{{{', '}}}'] |
markdown | Options passed in to markdown-it constructor | { typographer: true, linkify: true } |
content | Options passed to the reshape-content plugin | { md: renderMarkdown, mdi: renderMarkdownInline } |
parser | custom html parser if desired. pass false to use the default html parser |
sugarml |
retext | Plugins to be passed to the reshape-retext plugin | [smartypants] (ref) |
locals | Added directly to the output object, used when compiling a reshape template to html | {} |
alias | Alias option to be passed to the include plugin | |
parserRules | Parser rules to be passed to the include plugin | |
minify | Minifies the html output by removing excess spaces and line breaks | false |
appendPlugins | Adds a single plugin or array of plugins after all the defaults | |
prependPlugins | Adds a single plugin or array of plugins before all the defaults |
Markdown Rendering Functions
There are two markdown rendering shortcut functions provided with this plugin pack: md
and mdi
. The md
function will run a full markdown render including wrapping with a paragraph tag, rendering headlines, etc. For example:
.content(md).
# The title
Here's some text, wow.
A second paragraph!
This would work as expected, rendering title and paragraph tags:
<div class='content'>
<h1>The title</h1>
<p>Here's some text, wow.</p>
<p>A second paragraph!</p>
</div>
The mdi
shortcut is specifically for rendering inline markdown, not including any type of title tags or paragraph wrapping. So for example:
p(mdi) Hello, I am #1 and this is [my link](#).
Would render without additional paragraph wrappings or unexpected title renders:
<p> Hello, I am #1 and this is <a href='#'>my link</a>.
License & Contributing
- Details on the license can be found here
- Details on running tests and contributing can be found here