{"_id":"@dongivan/mathjax-vuewer","_rev":"3-ce13e667216eda3fb375754484b78b69","time":{"created":"2022-05-24T07:59:14.610Z","0.1.0":"2022-05-24T06:05:14.388Z","modified":"2022-05-24T14:41:51.320Z","0.1.1":"2022-05-24T07:59:14.889Z","0.1.2":"2022-05-24T14:41:51.252Z"},"name":"@dongivan/mathjax-vuewer","dist-tags":{"latest":"0.1.2"},"versions":{"0.1.1":{"name":"@dongivan/mathjax-vuewer","version":"0.1.1","private":false,"description":"A Vue component which could render MathML / LaTeX codes by MathJax.","main":"./dist/mathjax-vuewer.umd.js","module":"./dist/mathjax-vuewer.es.js","exports":{".":{"import":"./dist/mathjax-vuewer.es.js","require":"./dist/mathjax-vuewer.umd.js"}},"types":"./dist/types/index.d.ts","scripts":{"dev":"vite","build":"vite build && vue-tsc --emitDeclarationOnly && rimraf dist/src && move dist/packages dist/types","preview":"vite preview"},"dependencies":{"vue":"^3.2.25"},"devDependencies":{"@types/node":"^17.0.35","@vitejs/plugin-vue":"^2.3.3","typescript":"^4.5.4","vite":"^2.9.9","vue-tsc":"^0.34.16"},"browserslist":["> 1%","last 2 versions","not dead","not ie 11"],"repository":{"type":"git","url":"git+https://github.com/dongivan/mathjax-vuewer.git"},"keywords":["mathjax","vue"],"author":{"name":"Ivan Dong"},"license":"MIT","bugs":{"url":"https://github.com/dongivan/mathjax-vuewer/issues"},"homepage":"https://github.com/dongivan/mathjax-vuewer#readme","gitHead":"e2df5df0f55b75116f215563ef3f648b07c79cb2","_id":"@dongivan/mathjax-vuewer@0.1.1","_nodeVersion":"16.13.0","_npmVersion":"8.7.0","dist":{"integrity":"sha512-GsrS31DlsRbOS/Iknz/3Q2Si9bS2fEP9Yir+MPGeA1YZmaAXRJvaI0V6JaT8fF3iqs/6TTmGAMN8gVxdi1ymxQ==","shasum":"04eefd9cfaec3765a4bfff73116c9adadc90dc71","tarball":"https://registry.npmjs.org/@dongivan/mathjax-vuewer/-/mathjax-vuewer-0.1.1.tgz","fileCount":9,"unpackedSize":21703,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFsHLe/KGjb73pXRdiTE29Ky2wV55mMeEV0z+ZX9gM5YAiAb24LjEWfr9RGTK8kZrSLj88B0crvBeNSwTML0+ZtgTg=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJijJBSACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrxvQ/9G3oZ1Ef6GY9fDJcQPGqQ5D8VRUgsNKrHYh7r/Q8lSElv0jk8\r\n0snEPhFWLpaa/8Ipy03nOsup5Ep+wmzp7z7L7av7rKweoSTf9rWbOH5Ta9L4\r\nLLWdk8Lxb+ARYD5SrLgcKR8Ga7j3Zu3DdZbX03j7XlrcxpgOZA0siJ8enPhV\r\nrYk/zShWl9kb0fBK1VdO3CyxNxeU2YgToL4EosDzqWYpOmIGbByTrB02C0FJ\r\nGDHKzu2mgOG+Ws1JOqMAq+k57Vo494jZhKPnuwOnguW44P0iyTQo9A0QOezn\r\nqILn+L8Z1vfvUl3PMnPaB5lEzPqpsxoCFVGkCfJXEf6bsU80GGl1jTpAXzun\r\nSWfzAU8+tDMBb5NK48H/DEgRyKj00NiJt+ts/Z34lL3jQKApWzUQjFIIdh0n\r\nQRvlTpHBkpUNpvKu4xOIFMP0Oc3WqHDzNA2VdyOt3cFpj58KrYvBlA6yoLUn\r\n5u4gObOAsRc+BoM2/tfrOwsIvMEePk6c2iYJoQ31taQso0W+gppLgfzyziyR\r\nqxBviNSAhJMAdtw7LoB9URrtIo6UuOYRB7ax9pGZze1wn7TQPyPl0pq7XyPr\r\ndiOQDY7Ho990IQlMcSvHeqOQTvKgBkq32pwo/9Sny5FEYLzYgUtwMqNzFlu8\r\nE9p/FGhuDkzZMsBZAF+ANpLry99P7yGLe1Q=\r\n=AYvr\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"dongivan","email":"588153@qq.com"},"directories":{},"maintainers":[{"name":"dongivan","email":"588153@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/mathjax-vuewer_0.1.1_1653379154676_0.739371166143793"},"_hasShrinkwrap":false},"0.1.2":{"name":"@dongivan/mathjax-vuewer","version":"0.1.2","private":false,"description":"A Vue component which could render MathML / LaTeX codes by MathJax.","main":"./dist/mathjax-vuewer.umd.js","module":"./dist/mathjax-vuewer.es.js","exports":{".":{"import":"./dist/mathjax-vuewer.es.js","require":"./dist/mathjax-vuewer.umd.js"}},"types":"./dist/types/index.d.ts","scripts":{"dev":"vite","build":"vite build && vue-tsc --emitDeclarationOnly && rimraf dist/src && move dist/packages dist/types","preview":"vite preview"},"dependencies":{"vue":"^3.2.25"},"devDependencies":{"@types/node":"^17.0.35","@vitejs/plugin-vue":"^2.3.3","typescript":"^4.5.4","vite":"^2.9.9","vue-tsc":"^0.34.16"},"browserslist":["> 1%","last 2 versions","not dead","not ie 11"],"repository":{"type":"git","url":"git+https://github.com/dongivan/mathjax-vuewer.git"},"keywords":["mathjax","vue"],"author":{"name":"Ivan Dong"},"license":"MIT","bugs":{"url":"https://github.com/dongivan/mathjax-vuewer/issues"},"homepage":"https://github.com/dongivan/mathjax-vuewer#readme","gitHead":"732f6d1fdb3b8458a60a22726fd5ac3b88de2ae0","_id":"@dongivan/mathjax-vuewer@0.1.2","_nodeVersion":"16.13.0","_npmVersion":"8.7.0","dist":{"integrity":"sha512-BQSGzoHrUVHmw5sUwWub9NPyNvDqLXN3Cl23f8IusIdHb5Ca8GGFEJG/Rbq3zpIw4J0Rfc8ZlpRyyJCsWJvEzA==","shasum":"f06b8ee853d13dde4c87c78dd756112be6424aa3","tarball":"https://registry.npmjs.org/@dongivan/mathjax-vuewer/-/mathjax-vuewer-0.1.2.tgz","fileCount":9,"unpackedSize":21937,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG+4fUfR75YJMNBYpwUYUByhOlWvbJ803nZkhawm+1AQAiBKNNDGuMb9kJy59XnBeJkxHs7yn3ovZrKWc+84n8Bqng=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJijO6vACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqLhg/+JGr0TMKm90xHxbBYokMrBTfgW5xEBTmVasi9SXibCT5Tk1iS\r\nNshZUxOlq3U5C/4/b6TwhEa7h3tfDr8b/h+j56gQw5zaQ/8X00HHXRSmdk2i\r\n5mQzzi8gVDGbRo4uLmdjituNGSs+t32Wj+NzqlIGKZtZwgviC2tE0s4i0t8I\r\nr5s3X3eGxIW39P/KSDrJJDrKA/Txu38q2GAKQzyjoulK/wEbInXE1dF6tAEF\r\n4L82XusVF0x4rCT1m4lt6M9/PB3fDPfzGDKw/iJVBcQjhTYYu5MvzVXdMEp5\r\nNul2wNO2Ya6TpHCopvgC8wLxJ5XNluaedp2rucc8FxmNv/A7r6M22YO7KhxH\r\n/0wIXs31NtDsxohNMrnJ3tJoj8vr4aMAs6BsR/OB5l0B1CXC8MVERZzVpfJE\r\nQaS4COI3P9m7H6YUwM2cukV8tAQvNCItlb4NA8wLsh697+EzNAtdVDCsLSmB\r\ngJWYwKG8vt9ksTO7yqeETMBeGWckGbhT714kUG+RIbW8hdixDXXxdV4Bn7jk\r\ny2hmq+Pc7MqtNiMYPtWjPNBsw4yrPaIdHzUHz7uBr3Lsy9y6qbGUFJPtoNkk\r\n/Qwyp5CqG6ymlWTBNS3ZwZWCWj2rXitgxbLWpFkf/iRojj6W8SrMyDE+Z03t\r\nnGGZrQRJMaecvhjyZ6rG7syJ1OKvH8OEHyk=\r\n=to++\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"dongivan","email":"588153@qq.com"},"directories":{},"maintainers":[{"name":"dongivan","email":"588153@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/mathjax-vuewer_0.1.2_1653403311104_0.9889527697341967"},"_hasShrinkwrap":false}},"maintainers":[{"name":"dongivan","email":"588153@qq.com"}],"description":"A Vue component which could render MathML / LaTeX codes by MathJax.","homepage":"https://github.com/dongivan/mathjax-vuewer#readme","keywords":["mathjax","vue"],"repository":{"type":"git","url":"git+https://github.com/dongivan/mathjax-vuewer.git"},"author":{"name":"Ivan Dong"},"bugs":{"url":"https://github.com/dongivan/mathjax-vuewer/issues"},"license":"MIT","readme":"# mathjax-vuewer\n\nA Vue component which could render MathML / LaTeX codes by MathJax.\n\nBased on Vue 3.2 & MathJax 3.\n\n## Demo\n[formular](https://dongivan.github.io) uses this component to render expressions. You can see more details if you visit the link on a wide enough screen (width more than 540px).\n\n## Installation\n```\nnpm install @dongivan/mathjax-vuewer --save\n```\n\n## Usage\nFirstly, register the component as a Vue plugin.\n```\nimport MathJaxVuewer from \"@dongivan/mathjax-vuewer\"\nimport { createApp } from \"vue\";\n\nconst app = createApp(...);\napp.use(MathJaxVuewer, {\n  componentName: ...,\n  script: ...,\n  options: ...,\n})\n```\n\nThen, use it in your template.\n```\n<template>\n  <MathJaxVuewer :content=\"content\" source-format=\"tex\" target-format=\"html\" />\n</template>\n```\n\n### Plugin Options\n| Key | Type | Default | Description |\n|:---:|:----:|:-------:|:-----------:|\n| componentName | string | \"MathJaxVuewer\" | The component name used in template |\n| script | string | undefined | The url of MathJax script. If it is not set, you should load mathjax script by yourself (use \\<script> for example). |\n| options | Object | undefined | The options needed by MathJax when it initializes. If it is not set, you should write the config object(`window.MathJax`) to initialize the MathJax. \n\n### Component Props\n| Prop | Type | Default | Description |\n|:----:|:----:|:-------:|:-----------:|\n| content | string | required | The source content of expression. If you want to use a MathMLElement tree as content, you should render the MathMLElement tree as string first(use `ele.outerHTML` for example). |\n| source-format | \"mml\" \\| \"mathml\" \\| \"latex\" \\| \"tex\" | \"tex\" | The source format of expression. \"mml\" and \"mathml\" both mean using MathMLElement; \"latex\" and \"tex\" both mean using LaTex |\n| target-format | \"html\" \\| \"chtml\" \\| \"svg\" | \"chtml\" | The target format of expression. \"html\" and \"chtml\" both mean that the result will be rendered as html, and \"svg\" means that the result will be SVG. |\n| display | boolean | false | `display` will be used when MathJax renders the content while `source-format` is set to \"tex\"(or \"latex\"). The result would be a inline element if `display == false`, or a block element if `display == true`. When `source-format` is set to \"mml\"(or \"mathml\"), this prop will not be used (You should set an attribute named `display` and valued `block` of the root node of the MathMLElement tree if you want MathJax to render it as a block element).\n\n### Events emitted\n| Event | Description |\n|:-----:|:-----------:|\n| math-jax-loaded | The component will detect whether the MathJax is loaded and emit this event after that. And the component WILL NOT render the `content` before this event emitted. |\n\n\n## More\n### Load MathJax script while registering plguin vs Load MathJax manually\nMathJax is designed for render the whole page, and it will read the global variable `window.MathJax` and modify it when initializing. MathJaxVuewer will inject a `ready()` function (see [here](http://docs.mathjax.org/en/latest/web/configuration.html#configuring-mathjax-after-it-is-loaded)) into the `window.MathJax.startup` in order to know whether MathJax is ready, and this must be done before MathJax read `window.MathJax`.\nThat means, if you load MathJax manually (which means you leave `script` and `options` of the plugin option to `undefined`), things would be complicated: MathJax may read and modify `window.MathJax` before the `ready()` function is injected. In this situation, the component will test whether `window.MathJax.config` exists -- and emit \"math-jax-loaded\" if it does. However, even `window.MathJax.config` was set, the MathJax may not be ready at once, and the component may throw an error because it cannot find the render function like `tex2svgPromise()` before MathJax initialized.\n\n### Multiple components\nYou should load all MathJax components which used by MathJaxVuewer in the `window.MathJax` options (or plugin option). For example, you have two MathJaxVuewer components, one is used to render LaTeX to html, and the other renders MathMLElement to SVG, then you should have an options like this:\n```\n{\n  loader: {\n    load: [\"input/tex-base\", \"input/mml\", \"output/chtml\", \"output/svg\", \"[tex]/html\"],\n  },\n  tex: {\n    packages: {\n      \"[+]\": [\"base\"],\n    },\n  },\n  startup: {\n    output: [\"chtml\", \"svg\"],\n  },\n}\n```\nBecareful, the `options.startup.output` is important. Please set it correctly, or the component may throw an error that it cannot find the render function.\n","readmeFilename":"README.md"}