Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
webpack myth loader, a myth loader that supports @import declarations
const path = require('path');
const myth = require('myth');
const globby = require('globby');
const loaderUtils = require('loader-utils');
const resolve = function () {
const p = [__dirname].concat(Array.from(arguments));
return path.resolve.apply(path, p);
};
/**
* Custom myth loader that sets the source option to the root
* css file to make myth `@import`s resolve paths correctly.
*/
module.exports = function (src) {
this.cacheable && this.cacheable();
const options = loaderUtils.getOptions(this);
// add watch files as dependencies, so they trigger reloads
// we do this as an easy fix to make `@import`ed css files
// also reload on change.
if (options.watch) {
globby.sync([`${options.watch}/**/*.css`,
`!${options.watch}/node_modules`])
.map(file => resolve(file))
.forEach(path => this.addDependency(path));
}
const css = myth(src, {
source: options.source,
compress: options.compress || false
});
return css;
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.