How to use formula in vue-quill-editor?

I’m trying to use vue-quill-editor in my project, which is a webpack project. After I mount it as a component, everything looks well, but the formula button is not shown. I checked the document of quill, it said:

Formula - formula (requires KaTex)

So I import KaTex in a vue file like this:

import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";

import { quillEditor } from "vue-quill-editor";
import "katex/dist/katex.js";

However, it still not work.

I try add “formula” option like this:

      editorOption: {
        modules: {
          toolbar: [
            ["bold", "italic", "underline", "strike"],
            [{ list: "ordered" }, { list: "bullet" }],
            [{ color: [] }, { background: [] }],
            [{ align: [] }],
            ["image"],
            ["formula"]
          ]
        }
      },

The button of formula is shown, but it isn’t work correctly. And the error report:

Uncaught TypeError: Cannot read property 'render' of undefined
    at Function.create (quill.js:10926)
    at Object.create (quill.js:183)
    at Block.ContainerBlot.insertAt (quill.js:3407)
    at BlockBlot.insertAt (quill.js:7406)
    at Block.insertAt (quill.js:855)
    at Scroll.ContainerBlot.insertAt (quill.js:3404)
    at ScrollBlot.insertAt (quill.js:7145)
    at Scroll.insertAt (quill.js:4252)
    at Editor.insertEmbed (quill.js:2606)
    at quill.js:1379

[ChikuwaJB]

I found solution about this issue.

Add few lines to import katex module to component file.

import katex from 'katex';
import 'katex/dist/katex.min.css';

And add below lines to ‘mounted’ methods.

mounted() {
  window.katex = katex;
}

[gsern1]

I found solution about this issue.

Add few lines to import katex module to component file.

import katex from 'katex';
import 'katex/dist/katex.min.css';

And add below lines to ‘mounted’ methods.

mounted() {
  window.katex = katex;
}

Thanks, it works perfectly!