Nice Philanthropist Metalhead

npm

Need private packages and team management tools?Check out npm Orgs. »

gfm-loader

2.0.1 • Public • Published

gfm-loader

Webpack loader to apply gfm styles to html transformed via markdown-loader

License MIT Npm Downloads

Webpack loader to wrap markdown which has been been transformed to html in a <body> tag and apply gfm (github flavored markdown) styles.

Install

Npm Version

$ npm install gfm-loader

Usage

In webpack config (read loaders from bottom to top):

{
  rules: [
    {
      test: /\.md$/,
      use : [
        `file-loader?name=<output-path>`, // Save to given path
        `gfm-loader`, // Wrap html in body, apply gfm styles
        "extract-loader", // Extract html
        "html-loader", // Load html
        "markdown-loader", // Transfrom md -> html
      ]
    }
  ]
}

Example

See: examples/webpack.config.js

Rendered example (with border=true):

Rendered example

API

gfm-loader[?gfm=&style=&border=true]

gfm:

Default: https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/2.10.0/github-markdown.min.css

href for the gfm stylesheet.

`gfm-loader?gfm=build/css/gfm.css`

style:

href for an additional stylsheet. To customize gfm styles.

`gfm-loader?gfm=build/css/gfm.css&style=build/css/bundle.css`

border:

Include styles for a Github style border around the body. See example image above.

`gfm-loader?gfm=build/css/gfm.css&style=build/css/bundle.css&border=true`

Changelog

2.0.0:

  • Rename parameter href to gfm
  • Add parameters style and border

Related

  • setup-webpack - Simplifies eg. markdown transpilation; the module this loader was built for

License

MIT © Jonathan Neidel

install

npm i gfm-loader

Downloadsweekly downloads

1

version

2.0.1

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability