unplugin-vue-markdown
unplugin-vue-markdown
Compile Markdown to Vue component.
- 📚 Use Markdown as Vue components.
- 💚 Use Vue components in Markdown.
- 🔌 Supports Vite, Webpack, Vue CLI and more, powered by unplugin.
- ⚡️ The same transformation as VitePress.
Install
npm i unplugin-vue-markdown
Vite
// vite.config.ts
import Vue from '@vitejs/plugin-vue'
import Markdown from 'unplugin-vue-markdown/vite'
export default defineConfig({
plugins: [
Vue({
include: [/\.vue$/, /\.md$/], // <-- allows Vue to compile Markdown files
}),
Markdown({ /* options */ }),
],
})
Example: examples/vite
Webpack
// webpack.config.js
const Markdown = require('unplugin-vue-markdown/webpack')
const { VueLoaderPlugin } = require('vue-loader')
module.exports = {
/* ... */
module: {
rules: [
// ... other rules
{
test: /\.(vue|md)$/,
loader: 'vue-loader'
}
]
},
plugins: [
new VueLoaderPlugin(),
Markdown({ /* options */ })
]
}
Vue CLI
// vue.config.js
const Markdown = require('unplugin-vue-markdown/webpack')
module.exports = {
parallel: false, // Disable thread-loader which will cause errors, we are still investigating the root cause
chainWebpack: (config) => {
config.module
.rule('vue')
.test(/\.(vue|md)$/) // <-- allows Vue to compile Markdown files
config
.plugin('markdown')
.use(Markdown({
markdownUses: [
prism,
],
}))
},
}
Example: examples/vue-cli
Import Markdown as Vue components
<template>
<HelloWorld />
</template>
<script>
import HelloWorld from './README.md'
export default {
components: {
HelloWorld,
},
}
</script>
Use Vue Components inside Markdown
You can even use Vue components inside your markdown, for example
<Counter :init='5'/>
Related Packages
unplugin-vue-prop
Add import define props type support for Vue3 script-setup and lang is typescrip...
1,105
2
unplugin-image
A universal bundler plugin which imports JPG, PNG, GIF, SVG, and WebP files.
40,041
1
Version History
| Version | Released | License |
|---|---|---|
| 32.1.1 | MIT | |
| 32.1.0 | MIT | |
| 32.0.0 | MIT | |
| 31.0.0 | MIT | |
| 30.0.0 | MIT | |
| 29.2.0 | MIT | |
| 29.1.0 | MIT | |
| 29.0.0 | MIT | |
| 28.3.1 | MIT | |
| 28.3.0 | MIT | |
| 28.2.0 | MIT | |
| 28.1.0 | MIT | |
| 28.0.0 | MIT | |
| 0.28.0 | MIT | |
| 0.27.1 | MIT | |
| 0.27.0 | MIT | |
| 0.26.3 | MIT | |
| 0.26.2 | MIT | |
| 0.26.1 | MIT | |
| 0.26.0 | MIT | |
| 0.25.2 | MIT | |
| 0.25.1 | MIT | |
| 0.25.0 | MIT | |
| 0.24.3 | MIT | |
| 0.24.2 | MIT | |
| 0.24.1 | MIT | |
| 0.24.0 | MIT |