GithubHelp home page GithubHelp logo

Comments (2)

dzylikecode avatar dzylikecode commented on August 13, 2024

You can replace the original position about Doctify-Katex as below.

<head>
  <!-- begin for docsify katex -->
  <link
    rel="stylesheet"
    href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css"
    integrity="sha384-bYdxxUwYipFNohQlHt0bjN/LCpueqWz13HufFEV1SUatKs1cm4L6fFgCi1jT643X"
    crossorigin="anonymous"
  />
  <script
    defer
    src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js"
    integrity="sha384-Qsn9KnoKISj6dI8g7p1HBlNpVx0I8p1SvlwOldgi3IorMle61nQy4zEahWYtljaz"
    crossorigin="anonymous"
  ></script>
  <!-- the version of marked must be less than 4 -->
  <script src="https://cdn.jsdelivr.net/npm/marked@3"></script>
  <!-- end for docsify katex -->
</head>
<body>
  <div id="app"></div>
  <script src="//cdn.jsdelivr.net/npm/[email protected]/dist/mermaid.min.js"></script>
  <script>
    window.$docsify = {};
  </script>
  <!-- insert script before docsify.js-->
  <script>
    // import katex from "katex";
    // import marked from "marked";

    (function () {
      let oldMarkdown = window.$docsify.markdown;
      let newMarked = marked;
      let newM = JSON.stringify(newMarked);
      function newMarkdown(originMarked, originRenderer) {
        // let newMarked = marked; // in docsify.js: window.$marked = marked
        function isFn(obj) {
          return typeof obj === "function";
        }
        const mathExtension = {
          name: "math",
          level: "inline",
          start(src) {
            let index = src.match(/\$/)?.index;
            return index;
          },
          tokenizer(src, tokens) {
            const blockRule = /^\$\$((\\.|[^\$\\])+)\$\$/;
            const inlineRule = /^\$((\\.|[^\$\\])+)\$/;
            let match;
            if ((match = blockRule.exec(src))) {
              return {
                type: "math",
                raw: match[0],
                text: match[1].trim(),
                mathLevel: "block",
              };
            } else if ((match = inlineRule.exec(src))) {
              return {
                type: "math",
                raw: match[0],
                text: match[1].trim(),
                mathLevel: "inline",
              };
            }
          },
          renderer(token) {
            if (token.mathLevel === "block") {
              return (
                '<div class="math">' +
                katex.renderToString(token.text, {
                  throwOnError: false,
                  displayMode: true,
                }) +
                "</div>"
              );
            } else if (token.mathLevel === "inline") {
              return (
                '<span class="math">' +
                katex.renderToString(token.text, {
                  throwOnError: false,
                  displayMode: false,
                }) +
                "</span>"
              );
            }
          },
        };
        const merge =
          Object.assign ||
          function (to) {
            for (let i = 1; i < arguments.length; i++) {
              const from = Object(arguments[i]);
              for (const key in from) {
                if (hasOwn.call(from, key)) {
                  to[key] = from[key];
                }
              }
            }
            return to;
          };

        let opts = oldMarkdown || {};

        if (isFn(oldMarkdown)) {
          opts = originMarkdonw.apply(
            this, // this original
            originMarked,
            originRenderer
          ).defaults;
        } else {
          opts = merge(oldMarkdown, {
            renderer: merge(originRenderer, oldMarkdown.renderer),
          });
        }
        newMarked.setOptions(opts);
        newMarked.use({ extensions: [mathExtension] });

        return newMarked;
      }
      window.$docsify.markdown = newMarkdown;
    })();
  </script>
  <script src="//cdn.jsdelivr.net/npm/docsify@4/lib/docsify.js"></script>
</body>

from docsify-katex.

upupming avatar upupming commented on August 13, 2024

Thanks for @dzylikecode 's great work, you can follow the README.md to use whichever katex version you want.

from docsify-katex.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.