scss-extract-loader/index.js

Webpack loader for scss-extract. Extract structured variables when importing sass files.

const scssExtract = require("scss-extract");
const loaderUtils = require("loader-utils");
const path = require("path");

function normalizeDependency(dep) {
  if (path.posix.isAbsolute(dep)) {
    return dep;
  } else {
    return path.posix.join(process.cwd(), dep);
  }
}

module.exports = exports = function scssExtractLoader(content) {
  const callback = this.async();
  this.cacheable();

  const query = loaderUtils.getOptions(this);
  const plugins = (query ? query.plugins : []) || [];

  return scssExtract
    .render(Object.assign({}, query, { file: this.resourcePath }), { plugins })
    .then((rendered) => {
      this.value = [rendered.vars];
      const result = `module.exports = ${JSON.stringify(rendered.vars)};`;

      rendered.stats.includedFiles.forEach((includedFile) => {
        this.addDependency(normalizeDependency(includedFile));
      });

      callback(null, result);
    })
    .catch((err) => {
      if (err.file) {
        this.addDependency(normalizeDependency(err.file));
      }
      callback(err);
    });
};