logo
Fork me on GitHub

Markdown Rendering Simplified

Build GitHub license codecov npm npm


Table of Contents

Features

Getting Started

1. Install Writr

> npm install writr
    

2. Render from Markdown

import { Writr } from 'writr';
    
    const writr = new Writr();
    const markdown = `# Hello World ::-):\n\n This is a test.`;
    
    const html = await writr.render(markdown); // <h1>Hello World 🙂</h1><p>This is a test.</p>
    

Its just that simple. Want to add some options? No problem.

import { Writr } from 'writr';
    const writr = new Writr();
    const markdown = `# Hello World ::-):\n\n This is a test.`;
    const options  = {
    	emoji: false
    }
    const html = await writr.render(markdown, options); // <h1>Hello World ::-):</h1><p>This is a test.</p>
    

Want to render to a translation? No problem.

import { Writr } from 'writr';
    const writr = new Writr({ openai: 'your-api-key'});
    const markdown = `# Hello World ::-):\n\n This is a test.`;
    const langCode = 'es';
    const html = await writr.renderTranslation(markdown, langCode, options); // <h1>Hola Mundo 🙂</h1><p>Esta es una prueba.</p>
    

How about generating keywords and descriptions for your front matter?

import { Writr } from 'writr';
    const writr = new Writr({ openai: 'your-api-key'});
    const markdown = `# Hello World ::-):\n\n This is a test.`;
    const keywords = await writr.keywords(markdown); // ['Hello World', 'Test']
    const description = await writr.description(markdown); // 'Hello World Test'
    

API

new Writr(options?: WritrOptions)

You can access the WritrOptions from the instance of Writr. Here is an example of WritrOptions.

import { Writr, WritrOptions } from 'writr';
    const writrOptions = {
      openai: 'your-api-key', // openai api key (default: undefined)
      renderOptions: {
        emoji: true,
        toc: true,
        slug: true,
        highlight: true,
        gfm: true,
        math: true,
        mdx: true
      }
    };
    const writr = new Writr(writrOptions);
    

.engine

Accessing the underlying engine for this instance of Writr. This is a Processor<Root, Root, Root, undefined, undefined> fromt the unified .use() function. You can use this to add additional plugins to the engine.

.options

Accessing the default options for this instance of Writr.

.render(markdown: string, options?: RenderOptions): Promise<string>

Rendering markdown to HTML. the options are based on RenderOptions. Which you can access from the Writr instance.

import { Writr, RenderOptions } from 'writr';
    
    ## `RenderOptions`
    
    ```js
    interface RenderOptions {
      emoji?: boolean; // emoji support
      toc?: boolean; // table of contents generation
      slug?: boolean; // slug generation
      highlight?: boolean; // code highlighting
      gfm?: boolean; // github flavor markdown
    }
    

.renderSync(markdown: string, options?: RenderOptions): string

Rendering markdown to HTML synchronously. the options are based on RenderOptions. Which you can access from the Writr instance. The parameters are the same as the .render() function.

import { Writr } from 'writr';
    const writr = new Writr();
    const markdown = `# Hello World ::-):\n\n This is a test.`;
    const html = writr.renderSync(markdown); // <h1>Hello World 🙂</h1><p>This is a test.</p>
    

'.renderReact(markdown: string, options?: RenderOptions, reactOptions?: HTMLReactParserOptions): Promise
'

Rendering markdown to React. The options are based on RenderOptions and now HTMLReactParserOptions from html-react-parser.

import { Writr } from 'writr';
    const writr = new Writr();
    const markdown = `# Hello World ::-):\n\n This is a test.`;
    const reactElement = await writr.renderReact(markdown); // Will return a React.JSX.Element
    

'.renderReactSync(markdown: string, options?: RenderOptions, reactOptions?: HTMLReactParserOptions): React.JSX.Element'

Rendering markdown to React. The options are based on RenderOptions and now HTMLReactParserOptions from html-react-parser.

import { Writr } from 'writr';
    const writr = new Writr();
    const markdown = `# Hello World ::-):\n\n This is a test.`;
    const reactElement = writr.renderReactSync(markdown); // Will return a React.JSX.Element
    

Code of Conduct and Contributing

Code of Conduct and Contributing guidelines.

License

MIT © Jared Wray

Contributors

Latest's Releases

v3.2.3 May 13, 2024

What's Changed

Full Changelog: https://github.com/jaredwray/writr/compare/v3.2.2...v3.2.3

v3.2.2 Invalid date

What's Changed

Full Changelog: https://github.com/jaredwray/writr/compare/v3.2.1...v3.2.2

v3.2.1 March 06, 2024

What's Changed

Full Changelog: https://github.com/jaredwray/writr/compare/v3.2.0...v3.2.1

All Releases