Frequently Asked Questions

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-plugin

For Q-Press in a Quasar CLI Vite project:

quasar ext add @md-plugins/q-press

Refer 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-press

Choose 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-press

Choose 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.