md-to-prismic

A simple cli tool to convert markdown files to Prismic JSON. It supports YAML front matter to define the UID and other Custom Type fields. Markdown files are converted to a format that can be imported into the Afosto Prismic account as a blog post.

Usage

You can transform markdown within a project using the default export.

npm install @gijsbotje/md-to-prismic
# or
yarn add @gijsbotje/md-to-prismic

import mdToPrismic from '@gijsbotje/md-to-prismic';

const markdownContent = `
---
type: blog
lang: en-us
---

# my title

My content
`;

const prismicJSON = mdToPrismic(markdownContent, {
  fieldName: 'content', /* required */
  filename: 'my-blog-post.md', /* optional */
  sliceName: 'MyTextSlice', /* optional */
  sliceVariation: 'variation-2', /* string, default: 'default' */
  outputAs: 'slice', /* ['slice', 'field'], default: field */
});

console.log(prismicJSON);

To use the cli, globally install the package in your machine with your preferred package manager.

npm install -g @gijsbotje/md-to-prismic
# or
yarn add -g @gijsbotje/md-to-prismic

You can now run the package in a folder with markdown files. Selecting the folder will transform all markdown files and output a ready to go zip file. Selecting a single file will output a JSON file structured according to the Prismic JSON.

md-to-prismic

Run with arguments

Instead of using the prompts you can also set arguments.

| argument | description | type | default value | |----------------------|------------------------------------------------------|-------------------------------------------------|----------------------| | -p, --pathToConvert | Path of the file or folder to convert | [string] [required] | [default: null] | | -o, --outputAs | Output the rich text as a slice or field. | [string] [required] [choices: "slice", "field"] | [default: null] | | -f, --fieldName | ID of the field to output the richt text in | [string] [required] | [default: null] | | -s, --sliceName | ID of the slice to output the richt text in. | [string] [required: when outputAs === 'slice'] | [default: null] | | -v, --sliceVariation | Variation of the slice to output the richt text in. | [string] [required: when outputAs === 'slice'] | [default: "default"] |

md-to-prismic -p ./examples -o slice -f content -s paragraph

Supported Markdown elements

Because of the limitations within the Prismic rich text editor, not all elements are supported. Below is a list of all markdown elements and how they are handled.

| Element | Markdown Syntax | Support | |------------------|---------------------------------|-------------------------------------------------------------------------| | Text | paragraph text | ✅ | | Heading | # h1 | ✅ | | Bold | **bold text** | ✅ | | Italic | *italic text* | ✅ | | Link | [label](https://mywebsite.com) | ✅ | | image | ![alt text](image.jpg) | ✅ | | Ordered list | 1. First item | ⚠️ A list can only have one level in prismic | | Unordered list | - First item | ⚠️ A list can only have one level in prismic | | Inline code | `code` | 🚫 | | Horizontal rule | --- | 🚫 |

Extended Markdown Syntax

| Element | Markdown Syntax | Support | |------------------|----------------------------------------------------------------------|-------------------------------------------------------------------------| | Table | table | 🚫 | | Fenced code bock | code | ⚠️ Adds an empty preformatted text line. Looking for a fix on this one. | | Footnote | Here's a sentence with a footnote. [^1] [^1]: This is the footnote. | 🚫 | | Heading ID | ### My Great Heading {#custom-id} | 🚫 | | Definition list | term: definition | 🚫 | | Strikethrough | ~~strike though~~ | 🚫 | | Task list | - [x] Write the press release | 🚫 | | Emoji | smile! :joy: | 🚫 | | Highlight | highlight ==these words==. | 🚫 | | Subscript | h~2~o | 🚫 | | Superscript | x^2^ | 🚫 |

Contributing

clone the repository to your machine.

git clone [email protected]:afosto/md-to-prismic.git

Install the dependencies with yarn.

npm install

Link the package on your local machine.

npm link

You can now run the package in a folder with markdown files.

md-to-prismic