Use this page to quickly scan the questions people tend to ask while setting up MD-Plugins, Q-Press, and the direct Vite plugins.
General
Q. What are MD-Plugins?
A. MD-Plugins are Markdown-it and Vite plugins that help turn Markdown into application-ready content. They cover things like headings, links, frontmatter, images, code blocks, examples, and Q-Press documentation sites.
Q. Can I use MD-Plugins without Quasar?
A. Yes. The individual Markdown-it plugins and direct Vite plugins can be used in non-Quasar projects. For example, @md-plugins/vite-md-plugin and @md-plugins/vite-examples-plugin can be used in Vue/Vite projects, and the @md-plugins/md-plugin-* packages can be used anywhere you configure MarkdownIt.
The Quasar-specific limitation only applies to app extensions, such as Q-Press. Those app extensions target Quasar CLI Vite projects and are not intended for Webpack or JavaScript-only Quasar projects.
Q. Which package should I start with?
A. Use @md-plugins/quasar-app-extension-q-press if you want the full Q-Press documentation site experience inside a Quasar CLI Vite project.
Use @md-plugins/vite-md-plugin if you want Markdown pages or content in a Vue/Vite app without installing the Q-Press app extension.
Use the individual @md-plugins/md-plugin-* packages when you already own the MarkdownIt setup and only need specific behavior.
Installation And Updates
Q. How do I install MD-Plugins?
A. Install the package that matches your integration path. For direct Vite plugin usage:
pnpm add @md-plugins/vite-md-pluginFor Q-Press in a Quasar CLI Vite project:
quasar ext add @md-plugins/q-pressRefer to the installation section for each package when you need package-specific options.
Q. How do I update an existing Q-Press project?
A. Update the app extension package, then invoke it so the generated files can be refreshed:
pnpm up @md-plugins/quasar-app-extension-q-press
quasar ext invoke @md-plugins/q-pressChoose Overwrite All if you want the generated src/.q-press files to match the current release-candidate templates.
Q. Does Q-Press support Webpack projects?
A. No. Q-Press targets Quasar CLI Vite projects. The direct Markdown-it and Vite plugin packages are the right path for non-Quasar Vite projects.
Plugin Usage
Q. How do I add custom classes to images?
A. Use the image plugin and pass the class through its options:
import MarkdownIt from 'markdown-it'
import { imagePlugin } from '@md-plugins/md-plugin-image'
const md = new MarkdownIt()
md.use(imagePlugin, {
imageClass: 'custom-image-class',
})Q. How do I extract and process frontmatter content?
A. Use the frontmatter plugin and read the generated frontmatter from the MarkdownIt environment:
import MarkdownIt from 'markdown-it'
import { frontmatterPlugin } from '@md-plugins/md-plugin-frontmatter'
const md = new MarkdownIt()
md.use(frontmatterPlugin, {
grayMatterOptions: {
excerpt: true,
excerpt_separator: '<!-- more -->',
},
renderExcerpt: true,
})
const env = {}
const html = md.render(code, env)
console.log(env.frontmatter)Q. How do I enhance code block rendering?
A. Use the codeblocks plugin. It can render syntax-highlighted code blocks, copy buttons, tabbed code blocks, line highlighting, and code-group metadata:
import MarkdownIt from 'markdown-it'
import { codeblocksPlugin } from '@md-plugins/md-plugin-codeblocks'
const md = new MarkdownIt()
md.use(codeblocksPlugin, {
defaultLang: 'javascript',
containerComponent: 'MarkdownPrerender',
copyButtonComponent: 'MarkdownCopyButton',
})Q. How do I convert Markdown links into Vue components?
A. Use the link plugin to render Markdown links as Vue routing components:
import MarkdownIt from 'markdown-it'
import { linkPlugin } from '@md-plugins/md-plugin-link'
const md = new MarkdownIt()
md.use(linkPlugin, {
linkTag: 'RouterLink',
linkToKeyword: 'to',
pageScript: 'import { RouterLink } from "vue-router"',
})Troubleshooting
Q. My Markdown content is not rendering correctly. What should I check first?
A. Confirm that the package is installed, the plugin is registered with MarkdownIt or Vite, and your generated Q-Press files are current. If you recently upgraded Q-Press, run:
quasar ext invoke @md-plugins/q-pressChoose Overwrite All when you want the generated files to match the latest templates.
Q. How do I report a bug or request a feature?
A. Open an issue in the MD-Plugins repository and include the package name, version, reproduction steps, expected result, and actual result.
Q. Where can I get support?
A. Start with the package documentation and FAQ. If you are blocked or found a bug, open a GitHub issue with enough detail for someone else to reproduce the problem.