JSPM

@moox/markdown-to-json

1.0.0
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 147
  • Score
    100M100P100Q85149F
  • License MIT

Transform markdown files as json files

Package Exports

  • @moox/markdown-to-json

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@moox/markdown-to-json) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

markdown-to-json

Build Status Version

Repo on GitHub Repo on GitLab

Transform markdown content as a JSON

This package is a minimal markdown preprocessor to make it easy to render markdown in a JS environement like React, React Native etc.

It is meant to be used before runtime:

  1. You transform your markdown files as JSON
  2. You consume the JSON files from the JS without any runtime transformation required

Installation

npm install @moox/markdown-to-json

or

yarn add @moox/markdown-to-json

Usage

CLI

npx markdown-to-json "docs/**/*.md" [optional output-folder]

or

yarn markdown-to-json "docs/**/*.md" [optional output-folder]

⚠️ Be sure to put globs between quotes.

Node.js

const mdjs = require("@moox/markdown-to-json");
const output = mdjs.markdownAsJsTree("# markdown string");

By default, it handles:

  • front-matter (via gray-matter)
  • auto slug for headings (with anchors)
  • code highlight (via highlight.js)
  • table of contents (via remark-toc)

The idea is to get a markdown like this

---
test: a
test2: b
---

## Test

[link](href)

```js
console.log(window);
```

like

{
  "test": "a",
  "test2": "b",
  "headings": [
    {
      "id": "test",
      "level": 2,
      "text": "Test"
    }
  ],
  "body": {
    "tag": "div",
    "children": [
      {
        "tag": "h2",
        "props": {
          "id": "test"
        },
        "children": [
          //...
        ]
      }
    ]
  }
}

Options

In addition to the markdown string, 2 arguments are accepted that are functions that should returns an array of plugin with there options:

The first example is equivalent to

const mdjs = require("@moox/markdown-to-json");
const output = mdjs.markdownAsJsTree(
  "# markdown string",
  mdjs.defaultRemarkPlugins
  mdjs.defaultRehypePlugins
);

By default sending arguments will override default plugins. You can get the default one by doing something like this

const mdjs = require("@moox/markdown-to-json");
const output = mdjs.markdownAsJsTree(
  "# markdown string",
  () => ([
    [require("remark-whatever"), {optionForWhatever: true}],
    ...mdjs.defaultRemarkPlugins()
  ]),
  () => ([
    [require("rehype-hispterpackage"), {/* no options */}}],
    [require("rehype-anotherhispterpackage"), {powerUserOption: "super argument"}}],
    ...mdjs.defaultRehypePlugins()
  ]);
);

Thanks unified to make this possible!

Check out input & output to get an idea of what to expect from this package.


LICENSE