{"id":22485643,"url":"https://github.com/JanGuillermo/vue3-markdown-it","last_synced_at":"2025-08-02T18:33:11.795Z","repository":{"id":36970131,"uuid":"295107610","full_name":"JanGuillermo/vue3-markdown-it","owner":"JanGuillermo","description":"✨ An awesome Vue 3 markdown-it wrapper plugin that can even support external plugins!","archived":true,"fork":false,"pushed_at":"2022-12-08T22:23:13.000Z","size":11781,"stargazers_count":239,"open_issues_count":28,"forks_count":29,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-11-29T16:41:09.687Z","etag":null,"topics":["markdown","markdown-it","vue","vue3","vue3-markdown"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/JanGuillermo.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-09-13T08:16:33.000Z","updated_at":"2024-11-26T10:52:55.000Z","dependencies_parsed_at":"2022-07-06T08:11:51.807Z","dependency_job_id":null,"html_url":"https://github.com/JanGuillermo/vue3-markdown-it","commit_stats":null,"previous_names":[],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JanGuillermo%2Fvue3-markdown-it","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JanGuillermo%2Fvue3-markdown-it/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JanGuillermo%2Fvue3-markdown-it/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JanGuillermo%2Fvue3-markdown-it/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/JanGuillermo","download_url":"https://codeload.github.com/JanGuillermo/vue3-markdown-it/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":228499981,"owners_count":17929991,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["markdown","markdown-it","vue","vue3","vue3-markdown"],"created_at":"2024-12-06T17:12:57.592Z","updated_at":"2024-12-06T17:14:48.862Z","avatar_url":"https://github.com/JanGuillermo.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# Currently not being maintained.\n\nPlease go to [vite-plugin-vue-markdown](https://github.com/mdit-vue/vite-plugin-vue-markdown) or find another alternative.\n\n---\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"200\" src=\"logo.png\" alt=\"logo\"\u003e\n\u003c/p\u003e\n\n# ✨ vue3-markdown-it ✨\n\n[![GitHub package.json version](https://img.shields.io/github/package-json/v/JanGuillermo/vue3-markdown-it)](https://www.npmjs.com/package/vue3-markdown-it) [![Build Status](https://travis-ci.com/JanGuillermo/vue3-markdown-it.svg?branch=master)](https://travis-ci.com/JanGuillermo/vue3-markdown-it) [![codecov](https://codecov.io/gh/JanGuillermo/vue3-markdown-it/branch/master/graph/badge.svg)](https://codecov.io/gh/JanGuillermo/vue3-markdown-it) [![Dependencies Status](https://david-dm.org/JanGuillermo/vue3-markdown-it.svg)](https://david-dm.org/JanGuillermo/vue3-markdown-it) [![Known Vulnerabilities](https://snyk.io/test/github/JanGuillermo/vue3-markdown-it/badge.svg?targetFile=package.json)](https://snyk.io/test/github/JanGuillermo/vue3-markdown-it?targetFile=package.json) [![npm](https://img.shields.io/npm/dt/vue3-markdown-it)](https://www.npmjs.com/package/vue3-markdown-it)\n\n\u003e An awesome Vue 3 [markdown-it](https://github.com/markdown-it/markdown-it) wrapper plugin that can even support external plugins!\n\n🔎 [Live Demo](https://janguillermo.github.io/vue3-markdown-it/)\n\n---\n\n## Installation\n```\nnpm install vue3-markdown-it\n```\n\n## Supported Plugins\n- [markdown-it](https://github.com/markdown-it/markdown-it) - __The one__ that started it all\n- [markdown-it-abbr](https://github.com/markdown-it/markdown-it-abbr) - Add abbreviations\n- [markdown-it-anchor](https://github.com/valeriangalliat/markdown-it-anchor) - Add anchors\n- [markdown-it-deflist](https://github.com/markdown-it/markdown-it-deflist) - Add definition lists\n- [markdown-it-emoji](https://github.com/markdown-it/markdown-it-emoji) - Add emojis\n- [markdown-it-footnote](https://github.com/markdown-it/markdown-it-footnote) - Add footnotes\n- [markdown-it-highlightjs](https://github.com/valeriangalliat/markdown-it-highlightjs) - Add highlighting for code blocks\n- [markdown-it-ins](https://github.com/markdown-it/markdown-it-ins) - Add `\u003cins\u003e` tags\n- [markdown-it-mark](https://github.com/markdown-it/markdown-it-mark) - Add marking/highlighting\n- [markdown-it-sub](https://github.com/markdown-it/markdown-it-sub) - Add subscript\n- [markdown-it-sup](https://github.com/markdown-it/markdown-it-sup) - Add superscript\n- [markdown-it-task-lists](https://github.com/revin/markdown-it-task-lists) - Add task lists\n- [markdown-it-toc-done-right](https://github.com/nagaozen/markdown-it-toc-done-right) - Add table of contents\n\n## Usage\n### Global Use\n```js\nimport { createApp } from 'vue';\nimport Markdown from 'vue3-markdown-it';\n\nconst app = createApp();\n\napp.use(Markdown);\n```\n\n### CSS\nIf you want to use highlighting for code blocks, you'll have to import a CSS file from [highlight.js](https://github.com/highlightjs/highlight.js). View more styles [here](https://github.com/highlightjs/highlight.js/tree/master/src/styles). The code sample below imports the Monokai styling.\n```js\nimport 'highlight.js/styles/monokai.css';\n```\n\n### Single Use\n```vue\n\u003ctemplate\u003e\n  \u003cdiv\u003e\n    \u003cMarkdown :source=\"source\" /\u003e\n  \u003c/div\u003e\n\u003c/template\u003e\n\n\u003cscript\u003e\nimport Markdown from 'vue3-markdown-it';\n\nexport default {\n  components: {\n    Markdown\n  },\n  data() {\n    return {\n      source: '# Hello World!'\n    }\n  }\n}\n\u003c/script\u003e\n```\n\n## Props\nThe following properties are supported:\n\n### `anchor`\n\u003e View [markdown-it-anchor](https://github.com/valeriangalliat/markdown-it-anchor) for more information.\n\nType: `Object` | Default value: `null`\n\n### `breaks`\n\u003e Convert `\\n` in paragraphs into `\u003cbr\u003e`.\n\nType: `Boolean` | Default value: `false`\n\n### `emoji`\n\u003e View [markdown-it-emoji](https://github.com/markdown-it/markdown-it-emoji) for more information.\n\nType: `Object` | Default value: `null`\n\n### `highlight`\n\u003e View [markdown-it-highlightjs](https://github.com/valeriangalliat/markdown-it-highlightjs) for more information.\n\nType: `Object` | Default value: `null`\n\n### `html`\n\u003e Enable HTML tags in source.\n\nType: `Boolean` | Default value: `false`\n\n### `langPrefix`\n\u003e CSS language prefix for fenced blocks. Can be useful for external highlighters.\n\nType: `String` | Default value: `language-`\n\n### `linkify`\n\u003e Autoconvert URL-like text to links\n\nType: `Boolean` | Default value: `false`\n\n### `plugins` 🌟\n\u003e Don't see your favorite markdown-it plugin in the list of supported plugins? You can create an array of plugins and bind it into the component!\n\u003e \u003e The array only consists of objects (plugins in that case). A plugin has two properties:\n\u003e \u003e - `plugin`: A `markdown-it` plugin imported into this\n\u003e \u003e - `options`: Set the options for a specific `markdown-it` plugin.\n\u003e ```vue\n\u003e \u003ctemplate\u003e\n\u003e   \u003cdiv\u003e\n\u003e     \u003cMarkdown :source=\"source\" :plugins=\"plugins\" /\u003e\n\u003e   \u003c/div\u003e\n\u003e \u003c/template\u003e\n\u003e\n\u003e \u003cscript\u003e\n\u003e import MarkdownItStrikethroughAlt from 'markdown-it-strikethrough-alt';\n\u003e import Markdown from 'vue3-markdown-it';\n\u003e \n\u003e export default {\n\u003e   components: {\n\u003e     Markdown\n\u003e   },\n\u003e   data() {\n\u003e     return {\n\u003e       source: '--this is not so cool!--',\n\u003e       plugins = [\n\u003e         {\n\u003e           plugin: MarkdownItStrikethroughAlt\n\u003e         }\n\u003e       ]\n\u003e     }\n\u003e   }\n\u003e }\n\u003e \u003c/script\u003e\n\u003e ```\n\nType: `Array` | Default value: `[]`\n\n### `quotes`\n\u003e Double + single quotes replacement pairs, when typographer enabled and smartquotes on. Could be either a String or an Array. *For example*, you can use `«»„“` for Russian, `„“‚‘` for German, and `['«\\xA0', '\\xA0»', '‹\\xA0', '\\xA0›']` for French (including nbsp).\n\nType: `String | String[]` | Default value: `“”‘’`\n\n### `source`\n\u003e Content to be rendered into markdown.\n\nType: `String` | Default value: `null`\n\n### `tasklists`\n\u003e View [markdown-it-task-lists](https://github.com/revin/markdown-it-task-lists) for more information.\n\nType: `Object` | Default value: `null`\n\n### `toc`\n\u003e View [markdown-it-toc-done-right](https://github.com/nagaozen/markdown-it-toc-done-right) for more information.\n\nType: `Object` | Default value: `null`\n\n### `typographer`\n\u003e Enable some language-neutral replacement + quotes beautification.\n\nType: `Boolean` | Default value: `false`\n\n### `xhtmlOut`\n\u003e Use `/` to close single tags (`\u003cbr /\u003e`).\n\nType: `Boolean` | Default value: `false`\n\n## License\n[MIT](https://github.com/JanGuillermo/vue3-markdown-it/blob/master/LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FJanGuillermo%2Fvue3-markdown-it","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FJanGuillermo%2Fvue3-markdown-it","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FJanGuillermo%2Fvue3-markdown-it/lists"}