Skip to content

Latest commit

 

History

History

hook-handlebars

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
src
src
 
 
test
test
 
 
changelog.md
changelog.md
 
 
index.html
index.html
 
 
package.json
package.json
 
 
readme.md
readme.md
 
 
tsconfig.json
tsconfig.json
 
 
vite.config.ts
vite.config.ts
 
 

readme.md

marked-hook-handlebars

A sequential hook for marked to support Handlebars in Markdown documents.

Install

You can install marked-hook-handlebars using npm or yarn:

npm i marked-sequential-hooks marked-hook-handlebars
# or
yarn add marked-sequential-hooks marked-hook-handlebars

Usage

Once you've installed this hook, you can use it in your marked configuration. Here's an example of how to configure it:

Browser

<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Marked hook handlebars</title>
  </head>
  <body>
    <div id="content"></div>

    <script src="https://cdn.jsdelivr.net/npm/moo/moo.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/js-yaml/dist/js-yaml.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/handlebars@latest/dist/handlebars.js"></script>

    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/marked-sequential-hooks/dist/index.umd.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/marked-hook-frontmatter/dist/index.umd.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/marked-hook-handlebars/dist/index.umd.min.js"></script>
    <script>
      const md = `---
title: Hello, world!
author: John Doe
---

# {{title}}

This is the main content of your Markdown file autored by **{{author}}**.
`

      document.getElementById('content').innerHTML = new marked.Marked()
        .use(
          markedSequentialHooks({
            markdownHooks: [markedHookFrontmatter()],
            htmlHooks: [markedHookHandlebars()]
          })
        )
        .parse(md)
    </script>
  </body>
</html>

Try marked-hook-handlebars on RunKit

Node.js

import { Marked } from 'marked'
import markedSequentialHooks from 'marked-sequential-hooks'
import markedHookFrontmatter from 'marked-hook-frontmatter'
import markedHookHandlebars from 'marked-hook-handlebars'

const markdown = `---
title: Hello, world!
author: John Doe
---

# {{page.title}}

This is the main content of your Markdown file autored by **{{page.author}}**.
`

const html = new Marked()
  .use(
    markedSequentialHooks({
      markdownHooks: [
        markedHookFrontmatter({ dataPrefix: 'page' }),
        markedHookHandlebars()
      ]
    })
  )
  .parse(markdown)

console.log(html)

Now, running node example.js yields:

<h1>Hello, world!</h1>
<p>
  This is the main content of your Markdown file autored by
  <strong>John Doe</strong>.
</p>

Options

Please refer to the Handlebars runtime options.

Related

Contributing

We 💛  issues.

When committing, please conform to the semantic-release commit standards. Please install commitizen and the adapter globally, if you have not already.

npm i -g commitizen cz-conventional-changelog

Now you can use git cz or just cz instead of git commit when committing. You can also use git-cz, which is an alias for cz.

git add . && git cz

License

GitHub

A project by Stilearning © 2023.