{"id":50551723,"url":"https://github.com/sec-ant/rehype-ratex","last_synced_at":"2026-06-04T04:01:28.275Z","repository":{"id":350821132,"uuid":"1208391529","full_name":"Sec-ant/rehype-ratex","owner":"Sec-ant","description":"rehype plugin to render math with RaTeX","archived":false,"fork":false,"pushed_at":"2026-05-30T16:05:53.000Z","size":85,"stargazers_count":1,"open_issues_count":11,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-05-30T18:05:21.188Z","etag":null,"topics":["katex","ratex","rehype","rehype-katex","remark","remark-math"],"latest_commit_sha":null,"homepage":"https://sec-ant.github.io/rehype-ratex/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Sec-ant.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-04-12T07:59:22.000Z","updated_at":"2026-04-12T08:30:04.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/Sec-ant/rehype-ratex","commit_stats":null,"previous_names":["sec-ant/rehype-ratex"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Sec-ant/rehype-ratex","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sec-ant%2Frehype-ratex","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sec-ant%2Frehype-ratex/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sec-ant%2Frehype-ratex/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sec-ant%2Frehype-ratex/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Sec-ant","download_url":"https://codeload.github.com/Sec-ant/rehype-ratex/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Sec-ant%2Frehype-ratex/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33888302,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-04T02:00:06.755Z","response_time":64,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["katex","ratex","rehype","rehype-katex","remark","remark-math"],"created_at":"2026-06-04T04:01:26.536Z","updated_at":"2026-06-04T04:01:28.270Z","avatar_url":"https://github.com/Sec-ant.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# rehype-ratex\n\n[rehype](https://github.com/rehypejs/rehype) plugin to render math with [RaTeX](https://github.com/erweixin/RaTeX) — a Rust/WASM alternative to KaTeX. Outputs inline SVGs at build time, so no client-side JavaScript or CSS is needed to display math.\n\n## Features\n\n- Drop-in replacement for [rehype-katex](https://github.com/remarkjs/remark-math/tree/main/packages/rehype-katex) — same class conventions (`math-inline`, `math-display`, `language-math`)\n- Works with [remark-math](https://github.com/remarkjs/remark-math) out of the box\n- Renders to inline SVG (no client-side JS, no CSS, no font loading)\n- Accessible — SVGs include `role=\"img\"` and `aria-label` with the original LaTeX source\n- Powered by [ratex-wasm](https://www.npmjs.com/package/ratex-wasm) (Rust compiled to WebAssembly)\n- Zero client-side runtime — SVGs are embedded in the HTML at build time\n- ESM-only with full TypeScript declarations\n\n## Installation\n\n```bash\nnpm install @sec-ant/rehype-ratex\n```\n\n## Quick Start\n\n```ts\nimport rehypeParse from \"rehype-parse\";\nimport rehypeStringify from \"rehype-stringify\";\nimport { unified } from \"unified\";\nimport rehypeRatex from \"@sec-ant/rehype-ratex\";\n\nconst file = await unified()\n  .use(rehypeParse, { fragment: true })\n  .use(rehypeRatex)\n  .use(rehypeStringify)\n  .process('\u003cspan class=\"math-inline\"\u003ex^2 + y^2 = z^2\u003c/span\u003e');\n\nconsole.log(String(file));\n```\n\n## KaTeX Fonts\n\nThe rendered SVGs use `\u003ctext\u003e` elements referencing KaTeX font families (`KaTeX_Main`, `KaTeX_Math`, etc.). You need to load KaTeX fonts on any page that displays the output. The simplest way is to include the KaTeX CSS from a CDN:\n\n```html\n\u003clink\n  rel=\"stylesheet\"\n  href=\"https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/katex.min.css\"\n  crossorigin=\"anonymous\"\n/\u003e\n```\n\nOnly the `@font-face` declarations are needed — the layout CSS in `katex.min.css` won't interfere with the SVG output.\n\n### With remark-math (Markdown)\n\n```ts\nimport remarkMath from \"remark-math\";\nimport remarkParse from \"remark-parse\";\nimport remarkRehype from \"remark-rehype\";\nimport rehypeStringify from \"rehype-stringify\";\nimport { unified } from \"unified\";\nimport rehypeRatex from \"@sec-ant/rehype-ratex\";\n\nconst file = await unified()\n  .use(remarkParse)\n  .use(remarkMath)\n  .use(remarkRehype)\n  .use(rehypeRatex)\n  .use(rehypeStringify)\n  .process(\"Inline $E = mc^2$ and display:\\n\\n$$\\n\\\\int_0^\\\\infty e^{-x} dx = 1\\n$$\");\n\nconsole.log(String(file));\n```\n\n## API Reference\n\n### `rehypeRatex(options?)`\n\n```ts\nimport rehypeRatex from \"@sec-ant/rehype-ratex\";\n```\n\nThe plugin function. Pass it to `.use()` on a unified processor.\n\n### `Options`\n\n```ts\ninterface Options {\n  errorColor?: string;\n  fontSize?: number;\n  padding?: number;\n  strokeWidth?: number;\n}\n```\n\n| Option        | Type     | Default     | Description                                         |\n| ------------- | -------- | ----------- | --------------------------------------------------- |\n| `errorColor`  | `string` | `\"#cc0000\"` | Color for error fallback text when rendering fails  |\n| `fontSize`    | `number` | `1.21`      | Font size scale factor (em units) for SVG rendering |\n| `padding`     | `number` | `0`         | Padding around the SVG content (in pixels)          |\n| `strokeWidth` | `number` | `0.04`      | Stroke width for path elements (in em units)        |\n\nWASM is loaded automatically — from disk in Node.js, via `fetch` in browsers. No manual initialisation is needed.\n\n### Custom WASM Loading\n\nFor non-standard environments (edge runtimes, custom bundler setups), the native `initRatex` from `ratex-wasm` is re-exported. Call it before using the plugin to take full control of WASM loading:\n\n```ts\nimport rehypeRatex, { initRatex } from \"@sec-ant/rehype-ratex\";\n\n// Call initRatex with a custom loader before using the plugin\nawait initRatex(async () =\u003e {\n  // Your custom WASM loading logic here\n  // Must return { renderLatex: (s: string) =\u003e string }\n});\n\n// The plugin detects that WASM is already initialised and skips its own init\nunified().use(rehypeParse).use(rehypeRatex).use(rehypeStringify);\n```\n\nSee the [ratex-wasm documentation](https://www.npmjs.com/package/ratex-wasm) for the full `initRatex` API.\n\n## Supported Input Formats\n\nThe plugin recognizes the same HTML class conventions as rehype-katex:\n\n| Class           | Behavior                         | Typical source               |\n| --------------- | -------------------------------- | ---------------------------- |\n| `math-inline`   | Inline math                      | `$...$` via remark-math      |\n| `math-display`  | Display (block) math             | `$$...$$` via remark-math    |\n| `language-math` | Fenced code block (`\\`\\`\\`math`) | Markdown code fences         |\n\n## Error Handling\n\nWhen a LaTeX expression fails to render, the plugin:\n\n1. Emits a [VFile message](https://github.com/vfile/vfile#message) with source `\"rehype-ratex\"` and rule `\"ratex\"`\n2. Replaces the element with a `\u003cspan class=\"ratex-error\"\u003e` containing the original LaTeX text, styled with `errorColor`\n\nThis matches rehype-katex's error behavior — your build won't break on invalid math, and errors are visible in the output.\n\n## How It Works\n\n1. The plugin walks the hast (HTML AST) tree looking for elements with math classes\n2. LaTeX text is extracted and passed to `ratex-wasm`, which returns a DisplayList (a flat list of drawing commands)\n3. The DisplayList is converted to SVG elements — text glyphs, paths, lines, and rects\n4. The SVG replaces the original math element in the tree\n\nDisplay math uses `\\displaystyle` mode. The WASM module is initialized once and reused across all math elements.\n\n## License\n\n[MIT](./LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsec-ant%2Frehype-ratex","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsec-ant%2Frehype-ratex","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsec-ant%2Frehype-ratex/lists"}