remark-lint-mdx-jsx-self-close

remark-lint rule to warn when closing tags are used without children.

What is this?

This package checks that self-closing MDX JSX tags are used when possible.

When should I use this?

You can use this package to check that self-closing MDX JSX tags are used when possible.

Presets

This plugin is not included in presets maintained here.

Install

This package is ESM only. In Node.js (version 16+), install with npm:

npm install remark-lint-mdx-jsx-self-close

In Deno with esm.sh:

import remarkLintMdxJsxSelfClose from 'https://esm.sh/remark-lint-mdx-jsx-self-close@1'

In browsers with esm.sh:

<script type="module">
  import remarkLintMdxJsxSelfClose from 'https://esm.sh/remark-lint-mdx-jsx-self-close@1?bundle'
</script>

Use

On the API:

import remarkLint from 'remark-lint'
import remarkLintMdxJsxSelfClose from 'remark-lint-mdx-jsx-self-close'
import remarkParse from 'remark-parse'
import remarkStringify from 'remark-stringify'
import {read} from 'to-vfile'
import {unified} from 'unified'
import {reporter} from 'vfile-reporter'

const file = await read('example.md')

await unified()
  .use(remarkParse)
  .use(remarkLint)
  .use(remarkLintMdxJsxSelfClose)
  .use(remarkStringify)
  .process(file)

console.error(reporter(file))

On the CLI:

remark --frail --use remark-lint --use remark-lint-mdx-jsx-self-close .

On the CLI in a config file (here a package.json):

 …
 "remarkConfig": {
   "plugins": [
     …
     "remark-lint",
+    "remark-lint-mdx-jsx-self-close",
     …
   ]
 }
 …

API

This package exports no identifiers. It exports no additional TypeScript types. The default export is remarkLintMdxJsxSelfClose.

`unified().use(remarkLintMdxJsxSelfClose)`

Warn when closing tags are used without children.

Parameters

There are no parameters.

Returns

Transform (Transformer from unified).

Examples

`ok.mdx`

In

👉 Note: this example uses MDX (remark-mdx).

<strong>Venus</strong> and
<strong children={'Earth'} />.

Out

No messages.

`not-ok.mdx`

In

👉 Note: this example uses MDX (remark-mdx).

<a href="https://example.com/venus/"></a>.

Out

1:1-1:42: Unexpected closing tag on empty element, expected self-closing opening tag

`whitespace.mdx`

In

👉 Note: this example uses MDX (remark-mdx).

Whitespace in tags <Icon / > and whitespace
in elements <code> </code>.

Out

No messages.

Compatibility

Projects maintained by the unified collective are compatible with maintained versions of Node.js.

When we cut a new major release, we drop support for unmaintained versions of Node. This means we try to keep the current release line, remark-lint-mdx-jsx-self-close@1, compatible with Node.js 16.

Contribute

See contributing.md in remarkjs/.github for ways to get started. See support.md for ways to get help.

This project has a code of conduct. By interacting with this repository, organization, or community you agree to abide by its terms.

包详细信息