markdown-it-vanilla-loader

Load markdown files to html in webpack. Uses markdown-it and assumes nothing about your configuration.

Markdown-It-Vanilla-Loader

Uses markdown-itto render markdown to HTML and assumes nothing about your configuration.

Install

yarn add -D markdown-it-vanilla-loader

Usage

Input

# Your Markdown File

With some content.

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.md$/,
        use: [
          'html-loader',
          {
            loader: 'markdown-it-vanilla-loader',
            options: {
              highlight: (code, language) => {
                return language && highlightjs.getLanguage(language)
                  ? highlightjs.highlight(language, code).value
                  : code;
              }
            }
          }
        ]
      }
    ]
  }
};

Output

<h1>Your Markdown File</h1>

<p>With some content.</p>

Options

This loader accepts any options that are allowed on markdown-it, those options can be found here.

NameTypeDefaultDescription
plugins{array}[]Plugins to load into markdown-it

plugins

Plugins can be defined in 2 ways.

  1. Just a string with no options.
  2. An array where the first item is the plugin name and the second item is an object with options for that plugin.

webpack.config.js

{
  loader: 'markdown-it-vanilla-loader',
  options: {
    plugins: [
      // Just a string
      'markdown-it-anchor',
      // Array with options
      [
        'markdown-it-anchor',
        {
          permalink: true,
          permalinkSymbol: '',
          level: 2
        }
      ]
    ]
  }
}

Example

cd example
yarn
yarn build

Repository

https://github.com/hipstersmoothie/markdown-it-vanilla-loader


上一篇:github-semantic-version
下一篇:pretty-exceptions

相关推荐

官方社区

扫码加入 JavaScript 社区