Webpack loader to combine results from multiple loaders into one object
JavaScript
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
example
src
.babelrc
.eslintignore
.eslintrc
.gitignore
.npmignore
.travis.yml
LICENSE
README.md
appveyor.yml
package.json
yarn.lock

README.md

combine-loader

npm version Greenkeeper badge Travis CI Build Status Appveyor Build status

webpack loader to combine results from multiple loaders into one object

Installation

npm install combine-loader

Usage

In your webpack configuration, pass an object as the options for combine-loader. Each key-value pair corresponds to the same key in the exported object, using the provided loader string value to load the file. For example:

module.exports = {
  // ...
  module: {
    // ...
    rules: [
      {
        test: /\.md$/,
        loader: 'combine-loader',
        options: {
          raw: 'raw-loader',
          frontmatter: ['json-loader', 'front-matter-loader?onlyAttributes'],
          content: [
            'html-loader',
            'markdown-it-loader',
            'front-matter-loader?onlyBody',
          ],
        },
      }
    ]
  }
}

In the above example, the final exported value for .md files is an object with keys raw, frontmatter, and content, with values loaded using the provided loaders. In other words, this...

const example = require('./example.md')

...is effectively equivalent to this:

const example = {
  raw: require('!raw-loader!./example.md'),
  frontmatter: require('!json-loader!front-matter-loader?onlyAttributes!./example.md'),
  content: require('!html-loader!markdown-it-loader!front-matter-loader?onlyBody!./example.md')
}

NOTE: ! is prepended to override loaders in webpack's config