Remark plugins

Configure Remark plugins for editor customizations.

The Motif editor is based on Monaco, which is the same editor that powers Visual Studio Code. Thanks to its plugin architecture, it is possible to customize it extensively. Motif supports Remark plugins, which allow you to add features like spell checking, readability warnings and stylistic errors to the editing experience. You can also create your own plugins.

To configure the editor using Remark plugins, simply add a file named .remarkrc.js at the root of your project. Here is an example configuration:

//
// This is your remark configuration file. It’s used for validating your
// Markdown and MDX files. Note that they’re not used for transforming your
// files.
//
// Typically remark plugins catch stylistic errors in the Markdown syntax,
// whereas retext plugins catch writing problems.
//
// Find more remark-lint plugins at https://github.com/remarkjs/remark-lint#rules
// Find more retext plugins at https://github.com/retextjs/retext/blob/main/doc/plugins.md
//
import dictionary from 'dictionary-en'
import retextContractions from 'retext-contractions'
import retextDiacretics from 'retext-diacritics'
import retextEnglish from 'retext-english'
import retextEquality from 'retext-equality'
import retextIndefiniteArticle from 'retext-indefinite-article'
import retextProfanities from 'retext-profanities'
import retextQuotes from 'retext-quotes'
import retextReadability from 'retext-readability'
import retextRedundantAcronyms from 'retext-redundant-acronyms'
import retextRepeatedWords from 'retext-repeated-words'
import retextSimplify from 'retext-simplify'
import retextSpell from 'retext-spell'
import retextSyntaxUrls from 'retext-syntax-urls'
import { unified } from 'unified'
// This is your personal dictionary. This allows you to define words that would
// otherwise be reported by retext-spell. Each word is defined on its own line.
// It may either be a word, or or be of the form “new word/similar word”. The
// latter means the new word follows the same rules as the similar word.
const personal = `
MDX
URI/URL
stylesheet/sheet
`
// retext plugins must be specified using a unified pipeline
const retext = unified()
.use(retextEnglish)
.use(retextSyntaxUrls)
.use(retextContractions)
.use(retextDiacretics)
.use(retextEquality)
.use(retextIndefiniteArticle)
.use(retextProfanities)
.use(retextQuotes)
.use(retextReadability)
.use(retextRedundantAcronyms)
.use(retextRepeatedWords)
.use(retextSpell, { dictionary, personal })
.use(retextSimplify)
export default {
settings: {
listItemIndent: 'one',
},
plugins: [
// Possible Errors
'remark-lint-fenced-code-flag',
'remark-lint-no-blockquote-without-marker',
'remark-lint-no-empty-url',
'remark-lint-no-reference-like-url',
'remark-lint-no-undefined-references',
'remark-lint-no-unused-definitions',
'remark-lint-ordered-list-marker-value',
'remark-lint-table-pipes',
// Stylistic issues
['remark-lint-checkbox-character-style', { checked: 'x', unchecked: ' ' }],
'remark-lint-definition-case',
'remark-lint-definition-spacing',
['remark-lint-emphasis-marker', '_'],
'remark-lint-final-definition',
'remark-lint-heading-style',
'remark-lint-no-duplicate-defined-urls',
'remark-lint-no-duplicate-definitions',
'remark-lint-no-unneeded-full-reference-image',
'remark-lint-no-unneeded-full-reference-link',
['remark-lint-strikethrough-marker', '~~'],
['remark-lint-strong-marker', '*'],
// Content issues
'remark-lint-heading-increment',
'remark-lint-maximum-heading-length',
'remark-lint-no-duplicate-headings-in-section',
'remark-lint-no-emphasis-as-heading',
'remark-lint-no-heading-like-paragraph',
'remark-lint-no-heading-punctuation',
'remark-lint-no-inline-padding',
'remark-lint-no-literal-urls',
'remark-lint-no-multiple-toplevel-headings',
['remark-retext', retext],
],
}