This package is a unified (rehype) plugin. It Add the attribute translate="no"
to the katex formula generated by rehype-katex to prevent the formulas from being recognized and translated by webpage and browser translation tools, like Chrome translate.
This package is ESM only. In Node.js (version 16+), install with npm:
npm install rehype-katex-notranslate
Generally, this plugin is usually used with rehype-katex.
Say our document is
<p>
Lift(<code class="language-math">L</code>) can be determined by Lift
Coefficient (<code class="language-math">C_L</code>) like the following
equation.
</p>
<pre><code class="language-math">
L = \frac{1}{2} \rho v^2 S C_L
</code></pre>
import rehypeDocument from 'rehype-document';
import rehypeKatex from 'rehype-katex';
import rehypeParse from 'rehype-parse';
import rehypeStringify from 'rehype-stringify';
import rehypeKatexNotranslate from 'rehype-katex-notranslate';
import {read, write} from 'to-vfile';
import {unified} from 'unified';
const file = await unified()
.use(rehypeParse, {fragment: true})
.use(rehypeDocument, {
// Get the latest one from: <https://katex.org/docs/browser>.
css: 'https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css',
})
.use(rehypeKatex)
.use(rehypeKatexNotranslate) // Use this plugin after rehype-katex
.use(rehypeStringify)
.process(await read('input.html'));
file.basename = 'output.html';
await write(file);
Then it will outputs with
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>input</title>
<meta content="width=device-width, initial-scale=1" name="viewport" />
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css"
rel="stylesheet"
/>
</head>
<body>
<p>
Lift(<span class="katex" translate="no"><!--…--></span>) can be determined
by Lift Coefficient (<span class="katex" translate="no"><!--…--></span>)
like the following equation.
</p>
<span class="katex-display"><!--…--></span>
</body>
</html>
This plugin will add the attribute translate="no"
for every katex blocks.