remark-custom-directives

remark plugin to be used in conjunction with remark-directive to define custom directives.

Install

This package is ESM only. Install with npm:

npm install remark-custom-directives

Use

Add remark-custom-directives to your unified processor after remark-directive.

// other imports...
import remarkCustomDirectives from 'remark-custom-directives';

const directives = {
    textDirective: {
        /**
         * Wraps inline text with a <span class="highlight">
         */
        highlight(node) {
            const data = node.data || (node.data = {});
            data.hName = 'span';
            data.hProperties = { class: 'highlight' };
        }
    },
    leafDirective: {},
    containerDirective: {}
}

const processor = unified()
    .use(remarkParse)
    .use(remarkDirective)
    .use(remarkCustomDirectives, directives)
    .use(remarkRehype)
    .use(rehypeStringify);

TODO:

• Refine docs
• Add tests
• Add linter/formatter
• Add license