uzitech / marked-katex-extension Goto Github PK

View Code? Open in Web Editor NEW

38.0 38.0 10.0 4.2 MB

MarkedJS extension for katex syntax

Home Page: https://www.npmjs.com/package/marked-katex-extension

License: MIT License

JavaScript 97.95% TypeScript 2.05%

marked-katex-extension's Introduction

To learn more about me go to Tony.Brix.ninja 👨🏻‍💻

marked-katex-extension's People

Contributors

Stargazers

Watchers

Forkers

jaya-sys hayato-smz yangdaniu wtto00 rafi-riday xushengs creatormc key-moon dousha

marked-katex-extension's Issues

ending $ followed by a -

Improving the #193, would it be possible to add the - character as authorized after the trailing $ character ?

For example, this one does not work without adding an extra space:

$n$-vector

Currently works:

$n$ -vector

Ty.

Invalid regular expression: invalid group specifier name

Error reported on older versions of Safari:

Invalid regular expression: invalid group specifier name

This is due to the bug in Safari.
I tested it on iOS 13.

Version 2.1.0 has no issues, while version 3.0.3 will throw an error.

Need support marked@"^6.0.0"

npm i marked-katex-extension
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/marked
npm ERR!   marked@"^6.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer marked@"^4 || ^5" from [email protected]
npm ERR! node_modules/marked-katex-extension
npm ERR!   marked-katex-extension@"*" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! 
npm ERR! For a full report see:
npm ERR! /Users/why/.npm/_logs/2023-08-02T11_52_45_953Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in: /Users/why/.npm/_logs/2023-08-02T11_52_45_953Z-debug-0.log

Any quick solution for fonts missing?

How to distinguish a inline katex element from a block katex element?

Both generate the same html code.

How can I add a class or sth to the generate code?

update the regex for better experience

The output of $300 $400 is not correct, its behaving $300 $ as a katex, but you can update it changing the regex to behave like katex input only when there is no space attaching with $ in $...$ , also, are you using the displayMode: true for the displayMode? Its important to use the actual displayMode option cause otherwise some functions does not works.

check out the https://stackedit.io/app for feature ideas

Add esm and cjs libs

Currently (when building a project with vite - SvelteKit) i have to import the extension this way:

import markedKatex from "marked-katex-extension/src/index";

This could be resolved by adding libs files for esm syntax (and common js syntax)

this package seems like much easier than manually coding

output:'html' is not well like output:'mathml'

origin text

$-\log\frac{exp({v_{c}}^{\top}u_{o})}{\sum_{w\in D} exp({v_{c}}^{\top}u_{w})}$

output:'html'

output:'mathml'

However, the <math> tag rendered by mathml cannot be rendered in html2canvas.

The @traptitech/markdown-it-katex plugin of markdown-it can render MathML styles very well, but it uses the <html> tag instead of the <math> tag.

Issues with rendering code blocks that have a `$` on their first line

It seems like when using marked without marked-katex a text like

Check the README:
\```
$ cat README
Hello World!
\```

(don't mind the backslash)

is being rendered as intended, but with marked-katex, it is required to have at least two line breaks to make it work as intended.

Reproduction
https://svelte.dev/repl/c3a34f8ff6604397b70c3632624e54c5?version=4.2.1

When I use CommonJS `require`, I get an error (README outdated?)

I'm working on a project that uses CommonJS modules instead of ES modules. When I try to require the extension, I get an error.

My code:

const { marked } = require( 'marked' );
const markedKatex = require( 'marked-katex-extension' );

The error I'm seeing:

> node src/js/toHtml.js 
/Users/liam/,/programs/liam/0ty/src/js/toHtml.js:13
const markedKatex = require( 'marked-katex-extension' );
                    ^

Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/liam/,/programs/liam/0ty/node_modules/marked-katex-extension/src/index.js from /Users/liam/,/programs/liam/0ty/src/js/toHtml.js not supported.
Instead change the require of index.js in /Users/liam/,/programs/liam/0ty/src/js/toHtml.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (/Users/liam/,/programs/liam/0ty/src/js/toHtml.js:13:21) {
  code: 'ERR_REQUIRE_ESM'
}

I'm happy to use a dynamic import, but I thought I'd open up this issues since your README seems to indicate it's possible to use CommonJS require. Does the README need to be updated to reflect the fact that you can't use CommonJS require? Or am I doing something wrong? Thanks!

How to displaying Chemical Formulas Correctly with Vue3 and Katex using marked-katex-extension

<!-- App.vue -->
<template>
  <div>vue3 import is not displayed correctly</div>
  <div v-html="ceFormat"></div>
</template>

<script lang="ts" setup>
import 'katex/dist/contrib/mhchem.min.js' // how use this
import 'katex/dist/katex.min.css' // katex css
import katex from 'katex'

const ceStr = `\\ce{N2 + 3H2 <=>T[High temperature Pressurized][Catalyst] 2NH3}`
const ceFormat = katex.renderToString(
  ceStr,
  {
    throwOnError: false,
    strict: 'warn',
  })
</script>

<!-- app.html -->
<!DOCTYPE html>
<html>
  <head>
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css"
    />
    <script
    defer
      src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js"
    ></script>
    <script
    defer
      src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/mhchem.min.js"
    ></script>
    <script
    defer
      src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js"
      onload="renderMathInElement(document.body);"
    ></script>
  </head>
  <body>
    <p>
      html direct quote displays correctly
      <span class="katex-display">
        $$\ce{N2 + 3H2 <=>T[High temperature Pressurized][Catalyst] 2NH3}$$
      </span>
</html>

Hello,

I hope you don't mind me raising an issue.

I encountered some problems when using vue3 and katex to render chemical formulas. They are not displaying properly.

The aforementioned chemical formulas can be displayed correctly when directly referenced in HTML.

Could you please guide me on how to modify the code for vue3 when using your plugin marked-katex-extension to display chemical formulas correctly?

It seems that I need to use KatexOptions with macros, but I couldn't find suitable documentation to implement it. Any guidance would be greatly appreciated.

Thank you so much.

For reference on chemical formulas:

https://katex.org/docs/libs

https://github.com/KaTeX/KaTeX/tree/main/contrib/mhchem

Inline latex doesn't allow punctuation following the ending $

When I try to include an inline equation I can't seem to put punctuation after the ending $. The following examples don't work unless I put a space before the period or comma:

The algorithm has a time complexity of $O(log(n))$.

Let's consider $x$, $y$, and $z$.

Putting a space in any of those locations really doesn't look good, and I think it's incorrect to include the punctuation in the equation itself.

I took a quick look at the regex and I wonder if it's possible to change the final look-ahead from (=?\s|$) to (=?\W|$). The non-word class \W includes spaces, but also common punctuation, which would resolve my issue.

marked-katex-extension/src/index.js

Line 4 in afea812

const inlineRule = /^(\${1,2})(?!\$)((?:\\.|[^\\\n])+?)(?<!\$)\1(?=\s|$)/;

Hope to add Chinese punctuation in the punctuation after $

I am a developer from China and I saw issue #193

I am struggling with supporting latex in markdown, and this repository has been very helpful to me. However, just like #193 , I encountered the same problem with Chinese punctuation.

So, I hope to change the regular expression to this.
/^(\${1,2})(?!\$)((?:\\.|[^\\\n])*?(?:\\.|[^\\\n\$]))\1(?=[\s?!\.,:？！。，：]|$)/

My English proficiency is not good. If there are any mistakes, please forgive me.

($a_1$) and ($r$):

($r$):