Bypass inline code

[superhighfives]

Allows bypassing inline code blocks from being transformed by rehype-pretty-code.

Config:

import { unified } from "unified";
import remarkParse from "remark-parse";
import remarkRehype from "remark-rehype";
import rehypeStringify from "rehype-stringify";
import rehypePrettyCode from "rehype-pretty-code";

async function main() {
  const file = await unified()
    .use(remarkParse)
    .use(remarkRehype)
    .use(rehypePrettyCode, {
      bypassInlineCode: true
    })
    .use(rehypeStringify)
    .process("`const numbers = [1, 2, 3]{:js}`");

  console.log(String(file));
}

main();

Input:

```js
const x = true;
```

`const x = true;{:js,bypassInlineCode:true}`

Output:

<figure data-rehype-pretty-code-figure="">
  <pre
    style="background-color: #24292e; color: #e1e4e8"
    tabindex="0"
    data-language="js"
    data-theme="github-dark"
  ><code data-language="js" data-theme="github-dark" style="display: grid;"><span data-line=""><span style="color:#F97583">const</span><span style="color:#79B8FF"> x</span><span style="color:#F97583"> =</span><span style="color:#79B8FF"> true</span><span style="color:#E1E4E8">;</span></span></code></pre>
</figure>
<p><code>const x = true;{:js,bypassInlineCode:true}</code></p>

[changeset-bot]

🦋 Changeset detected

Latest commit: a34e2cf

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
rehype-pretty-code	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[pkg-pr-new]

commit: a34e2cf

pnpm add https://pkg.pr.new/rehype-pretty-code@233

pnpm add https://pkg.pr.new/@rehype-pretty/transformers@233

Open in Stackblitz •