How to use the purgecss function in purgecss

To help you get started, we’ve selected a few purgecss examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github feross / bitmidi.com / tools / build-css.js View on Github external
function purge (css) {
  // Files to search for used selectors. Used selectors will not be purged.
  const content = [
    './src/views/*.js',
    './src/server/*.ejs'
  ]

  // Whitelist of selectors to never purge
  const whitelistPatternsChildren = [
    // Theme colors
    ...Object.values(theme).map(color => new RegExp(`.*?${color}.*?`))
  ]

  const purgeCss = new PurgeCss({
    css,
    content,
    whitelistPatternsChildren,
    keyframes: true,
    rejected: argv.debug
  })

  const files = purgeCss.purge()

  // Print removed CSS selectors
  if (argv.debug) {
    files.forEach(file => {
      console.log(`Removed from ${file.file}:`)
      file.rejected.forEach(rejectedDecl => console.log(`  ${rejectedDecl}`))
    })
  }
github WeAreGenki / minna-ui / utils / rollup-plugin-purgecss / src / index.ts View on Github external
const defaults = {
          content,
          keyframes: true,
          rejected: debug,
          whitelistPatternsChildren: [/svelte-/],
        };
        const opts = Object.assign(defaults, options, {
          css: [
            {
              extension: 'css',
              raw: code,
            },
          ],
        });

        const result = new Purgecss(opts).purge()[0];

        if (result.rejected && result.rejected.length) {
          // eslint-disable-next-line no-console
          console.log('[purgecss] Rejected selectors', id, result.rejected);
        }

        // eslint-disable-next-line consistent-return
        return {
          code: result.css,
        };
      } catch (err) {
        this.error(err);
      }
    },
  };
github anantoghosh / gatsby-plugin-purgecss / src / loader.js View on Github external
if (options.purgeOnly.some(file => normalizedPath.includes(file))) {
      console.log(
        '\ngatsby-plugin-purgecss: Only processing ',
        this.resourcePath
      );
    } else {
      stats.addRemovedSize(source);
      return source;
    }
  }

  let css;
  try {
    // @ts-ignore
    css = new PurgeCss({
      css: [{ raw: source }],
      ...options
    }).purge();
  } catch (error) {
    console.log(
      '\ngatsby-plugin-purgecss: Could not parse file, skipping. Your build will not break.\n',
      this.resourcePath
    );

    if (options.debug) {
      Debug.writeAppendError(error);
    } else {
      console.log('Use debug option to investigate further.');
    }

    return source;
github FullHuman / rollup-plugin-purgecss / src / index.js View on Github external
transform(code, id) {
            if (!filter(id)) return null

            const purgecss = new Purgecss({
                content: options.content,
                css: [{
                    raw: code
                }]
            })
            let css = purgecss.purge()[0].css
            styles.push(css)

            css = JSON.stringify(css)
            if (options.insert) {
                // do thing
            } else if (!options.output) {
                code = css
            } else {
                code = `"";`
            }
github FullHuman / purgecss / packages / purgecss-webpack-plugin / lib / purgecss-webpack-plugin.es.js View on Github external
// Compile through Purgecss and attach to output.
                            // This loses sourcemaps should there be any!
                            var options = _extends({}, _this.options, {
                                content: filesToSearch,
                                css: [{
                                    raw: asset.source()
                                }]
                            });
                            if (typeof options.whitelist === 'function') {
                                options.whitelist = options.whitelist();
                            }
                            if (typeof options.whitelistPatterns === 'function') {
                                options.whitelistPatterns = options.whitelistPatterns();
                            }
                            var purgecss = new Purgecss(options);
                            compilation.assets[name] = new ConcatSource(purgecss.purge()[0].css);
                        });
                    });
github FullHuman / purgecss-webpack-plugin / src / index.js View on Github external
{
                            raw: asset.source()
                        }
                    ]
                }
                if (typeof options.whitelist === 'function') {
                    options.whitelist = options.whitelist()
                }
                if (typeof options.whitelistPatterns === 'function') {
                    options.whitelistPatterns = options.whitelistPatterns()
                }
                if (typeof options.whitelistPatternsChildren === 'function') {
                    options.whitelistPatternsChildren = options.whitelistPatternsChildren()
                }

                const purgecss = new Purgecss(options)
                const purged = purgecss.purge()[0]

                if (purged.rejected) {
                    purgedStats[name] = purged.rejected
                }

                compilation.assets[name] = new ConcatSource(purged.css)
            })
        })
github FullHuman / rollup-plugin-purgecss / lib / rollup-plugin-purgecss.es.js View on Github external
transform(code, id) {
            if (!filter(id)) return null;

            const purgecss = new Purgecss({
                content: options.content,
                css: [{
                    raw: code
                }]
            });
            let css = purgecss.purge()[0].css;
            styles.push(css);

            css = JSON.stringify(css);
            if (options.insert) ; else if (!options.output) {
                code = css;
            } else {
                code = `"";`;
            }

            return {
github FullHuman / purgecss-webpack-plugin / lib / purgecss-webpack-plugin.es.js View on Github external
}]
          });

          if (typeof options.whitelist === 'function') {
            options.whitelist = options.whitelist();
          }

          if (typeof options.whitelistPatterns === 'function') {
            options.whitelistPatterns = options.whitelistPatterns();
          }

          if (typeof options.whitelistPatternsChildren === 'function') {
            options.whitelistPatternsChildren = options.whitelistPatternsChildren();
          }

          var purgecss = new Purgecss(options);
          var purged = purgecss.purge()[0];

          if (purged.rejected) {
            purgedStats[name] = purged.rejected;
          }

          compilation.assets[name] = new ConcatSource(purged.css);
        });
      });

purgecss

Remove unused css selectors

MIT
Latest version published 1 month ago

Package Health Score

95 / 100
Full package analysis