Snowpack Plugin Mdsvex

Include Svelte-enhanced markdown files via MDSVEX with Snowpack


Use Markdown enhanced with Svelte components compiled by MDSvex to parse .md and .svx files with Snowpack!

Types Codecov Build Status NPM Version MIT License


This plugin was created to be used within a Svelte project, but could possbily be used in a non-Svelte app since this plugin parses .md and .svx files into JS externally of the main Svelte preprocessor loop used in @snowpack/plugin-svelte.

Note: The plugin was archived at one point when the preprocessor option was added to @snowpack/plugin-svelte, however since a Snowpack plugin's resolve.input doesn't allow dyanmic input it was not possible to make Snowpack aware of extensions beyond .svelte.

yarn add snowpack-plugin-mdsvex -D
# or
npm i snowpack-plugin-mdsvex --dev -D

Peer dependencies: svelte, snowpack, mdsvex.

Quick start

If starting a new project, tryout Create Snowpack App (CSA) using either:

  • @snowpack/app-template-svelte
  • @snowpack/app-template-svelte-typescript

Otherwise, after installing, update your snowpack config:

// snowpack.config.json
  "plugins": [
    ["snowpack-plugin-mdsvex", { /* see "Plugin Options" below */ }],

Plugin Options

interface SnowpackPluginMdsvexOptions {
   * Includes only the  specified paths
  include?: string[]
   * Excludes the specified paths
  exclude?: string[]
   * Include CSS. Default: false
  css?: boolean
   * These options are passed directly to the MDSvex compiler
  mdsvexOptions?: Record<string, any>

Supported MDSvex options:

interface MdsvexOptions {
   * Use custom extensions
   * example: ['.dvx']
  extensions?: string[]
  • extensions: Set if you wish to use any custom extensions. Defaults: ['.md', '.svx'].
  • [TODO]: View all MDSvex options. With exception to custom extensions, all other MDSvex options have not been tested, but should work.




Top categories

Loading Svelte Themes