utils/rollup-plugins/lib/postcss.js
function postcssRollup({
  content = [
    '__sapper__/build/*.html',
    '__sapper__/build/*.js',
    // FIXME: Using `dist` is the most reliable but requires 2 builds
    // 'dist/**/*.html',
    // 'dist/**/*.js',
    'src/**/*.html',
    'src/**/*.js',
  ],
  context = {},
  exclude = [],
  include = ['**/*.css'],
  optimize = process.env.NODE_ENV !== 'development',
  whitelist = [],
} = {}) {
  const filter = createFilter(include, exclude);

  return {
    name: 'postcss',

    async transform(source, id) {
      if (!filter(id)) return;

      try {
        const ctx = merge(
          { from: id, to: id, map: { inline: false, annotation: false } },
          context,
        );
        const { plugins, options } = await postcssrc(ctx);
        const result = await postcss(plugins).process(source, options);

        result.warnings().forEach((warn) => {
          this.warn(warn.toString(), { line: warn.line, column: warn.column });
        });

        // register sub-dependencies so rollup can monitor them for changes
        if (result.map) {
          const basePath = dirname(id);
          // TODO: Don't use PostCSS private API
          /* eslint-disable-next-line no-underscore-dangle */
          result.map._sources._array.forEach((dep) => {
            this.addWatchFile(join(basePath, dep));
          });
        }

        if (!optimize) {
          /* eslint-disable-next-line consistent-return */
          return {
            code: result.css,
            map: result.map,
          };
        }

        const purgecss = new Purgecss({
          content,
          whitelist,
          css: [{ raw: result.css }],
          keyframes: true,
        });

        const purged = purgecss.purge()[0];

        /* eslint-disable-next-line consistent-return */
        return {
          code: purged.css,
          map: purged.map,
        };
      } catch (err) {
        if (err.name === 'CssSyntaxError') {
          process.stderr.write(err.message + err.showSourceCode());
        } else {
          this.error(err);
        }
      }
    },
  };
}
function postcssRollup({
  content = [
    '__sapper__/build/*.html',
    '__sapper__/build/*.js',
    // FIXME: Using `dist` is the most reliable but requires 2 builds
    // 'dist/**/*.html',
    // 'dist/**/*.js',
    'src/**/*.html',
    'src/**/*.js',
  ],
  context = {},
  exclude = [],
  include = ['**/*.css'],
  optimize = process.env.NODE_ENV !== 'development',
  whitelist = [],
} = {}) {
  const filter = createFilter(include, exclude);

  return {
    name: 'postcss',

    async transform(source, id) {
      if (!filter(id)) return;

      try {
        const ctx = merge(
          { from: id, to: id, map: { inline: false, annotation: false } },
          context,
        );
        const { plugins, options } = await postcssrc(ctx);
        const result = await postcss(plugins).process(source, options);

        result.warnings().forEach((warn) => {
          this.warn(warn.toString(), { line: warn.line, column: warn.column });
        });

        // register sub-dependencies so rollup can monitor them for changes
        if (result.map) {
          const basePath = dirname(id);
          // TODO: Don't use PostCSS private API
          /* eslint-disable-next-line no-underscore-dangle */
          result.map._sources._array.forEach((dep) => {
            this.addWatchFile(join(basePath, dep));
          });
        }

        if (!optimize) {
          /* eslint-disable-next-line consistent-return */
          return {
            code: result.css,
            map: result.map,
          };
        }

        const purgecss = new Purgecss({
          content,
          whitelist,
          css: [{ raw: result.css }],
          keyframes: true,
        });

        const purged = purgecss.purge()[0];

        /* eslint-disable-next-line consistent-return */
        return {
          code: purged.css,
          map: purged.map,
        };
      } catch (err) {
        if (err.name === 'CssSyntaxError') {
          process.stderr.write(err.message + err.showSourceCode());
        } else {
          this.error(err);
        }
      }
    },
  };
}
function postcssRollup ( { content = [ '__sapper__/build/*.html' , '__sapper__/build/*.js' , // FIXME: Using `dist` is the most reliable but requires 2 builds // 'dist/**/*.html', // 'dist/**/*.js', 'src/**/*.html' , 'src/**/*.js' , ] , context = { } , exclude = [ ] , include = [ '**/*.css' ] , optimize = process . env . NODE_ENV !== 'development' , whitelist = [ ] , } = { } ) { const filter = createFilter ( include , exclude ) ; return { name : 'postcss' , async transform ( source , id ) { if ( ! filter ( id ) ) return ; try { const ctx = merge ( { from : id , to : id , map : { inline : false , annotation : false } } , context , ) ; const { plugins , options } = await postcssrc ( ctx ) ; const result = await postcss ( plugins ) . process ( source , options ) ; result . warnings ( ) . forEach ( ( warn ) => { this . warn ( warn . toString ( ) , { line : warn . line , column : warn . column } ) ; } ) ; // register sub-dependencies so rollup can monitor them for changes if ( result . map ) { const basePath = dirname ( id ) ; // TODO: Don't use PostCSS private API /* eslint-disable-next-line no-underscore-dangle */ result . map . _sources . _array . forEach ( ( dep ) => { this . addWatchFile ( join ( basePath , dep ) ) ; } ) ; } if ( ! optimize ) { /* eslint-disable-next-line consistent-return */ return { code : result . css , map : result . map , } ; } const purgecss = new Purgecss ( { content , whitelist , css : [ { raw : result . css } ] , keyframes : true , } ) ; const purged = purgecss . purge ( ) [ 0 ] ; /* eslint-disable-next-line consistent-return */ return { code : purged . css , map : purged . map , } ; } catch ( err ) { if ( err . name === 'CssSyntaxError' ) { process . stderr . write ( err . message + err . showSourceCode ( ) ) ; } else { this . error ( err ) ; } } } , } ; }
Rollup plugin to process any imported CSS via PostCSS and optionally remove
unused styles for significantly smaller CSS bundles.
@param {Object} opts User defined options.
@param {(Array<string>|Function)=} opts.content Page content.
@param {Object=} opts.context Base PostCSS options.
@param {Array<string>=} opts.exclude Files to exclude from CSS processing.
@param {Array<string>=} opts.include Files to include in CSS processing.
@param {Array<string>=} opts.content Files to parse for CSS classes.
@param {boolean=} opts.optimize Should output CSS be minified and cleaned?
@param {Array<string>=} opts.whitelist CSS classes to always keep.
@returns {Object} Rollup plugin
Rollup plugin to process any imported CSS via PostCSS and optionally remove unused styles for significantly smaller CSS bundles .