How to use uncss - 6 common examples

To help you get started, we’ve selected a few uncss 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 mikelambert / dancedeets-monorepo / server / uncssWebpackGenerator.js View on Github external
// This handles a bunch for us:
                    // autoprefixer: Adds vendor prefixes to CSS, using Autoprefixer.
                    // filters: Converts CSS shorthand filters to SVG equivalent
                    // rem: Generates pixel fallbacks for rem units
                    // pseudoElements: Converts pseudo-elements using CSS3 syntax
                    //   (two-colons notation like ::after, ::before, ::first-line and ::first-letter) with the old one
                    // opacity: Adds opacity filter for IE8 when using opacity property
                    //
                    // We intentionally don't do any minification, since we'd prefer to run uncss first
                    pleeease({
                      import: false,
                      rebaseUrls: false,
                      minifier: false,
                      browsers: ['> 2%'],
                    }),
                    uncss.postcssPlugin({
                      html: [...htmlFiles, 'amp/empty.html'],
                      ignore,
                    }),
                  ],
                },
github micromata / Baumeister / gulp / tasks / styles.js View on Github external
function styles() {
	if (isProdBuild()) {
		return gulp.src(settings.sources.stylesEntryPoint)
			.pipe(sass())
			.pipe(postcss([
				autoprefixer(autoPrefixOptions),
				cssnano({
					discardComments: {
						removeAll: true
					}
				})
			]))
			.pipe(rename('index.min.css'))
			.pipe(gulp.dest(settings.destinations.prod.styles))
			.pipe(rename('index.uncss.min.css'))
			.pipe(postcss([uncss.postcssPlugin(uncssOptions)]))
			.pipe(gulp.dest(settings.destinations.prod.styles));
	}
	return gulp.src(settings.sources.stylesEntryPoint)
		.pipe(plumber({errorHandler: onError}))
		.pipe(sourcemaps.init())
		.pipe(sass())
		.pipe(postcss([autoprefixer(autoPrefixOptions)]))
		.pipe(sourcemaps.write('./'))
		.pipe(gulp.dest(settings.destinations.dev.styles));
}
github mikelambert / dancedeets-monorepo / webpack.amp.config.js View on Github external
postcss: function() {
    return [
      uncss.postcssPlugin({
        html: ['templates/event_amp.html'],
      }),
    ];
  },
};
github atolye15 / web-starter-kit / gulp / tasks / styles.js View on Github external
export default function styles(cb) {
  const stylesMinChannel = lazypipe()
    .pipe(postcss, [
      appConfig.uncssActive ? uncss.postcssPlugin(uncssOptions) : () => {},
      cssnano({ discardComments: { removeAll: true } }),
    ])
    .pipe(rename, { suffix: '.min' })
    .pipe(gulp.dest, `${envPath}/${paths.assets.css}`);

  /**
   * Warning:
   *   1. Returning the gulp stream causes an uncompleted task, I suppose because of the lazypipe.
   *      So we used the cb function to finish the task.
   *   2. For best performance, don't add Sass partials to `gulp.src`
   */

  return gulp
    .src(appConfig.entry.styles, { sourcemaps: true })
    .pipe(sass({ precision: 10, importer: inlineCssImporter }).on('error', errorHandler))
    .pipe(
github AlexisDanizan / Checklist-Tools-Website / gulpfile.js View on Github external
'use strict';
const gulp = require('gulp');
const nunjucks = require('gulp-nunjucks');
const imagemin = require('gulp-imagemin');
const htmlmin = require('gulp-htmlmin');
const browserify = require('browserify');
const babel = require('babelify');
const uglify = require('gulp-uglify');
const source = require('vinyl-source-stream');
const buffer = require('vinyl-buffer');
const sass = require('gulp-sass');
const uncss = require('uncss').postcssPlugin;
const concat = require('gulp-concat');
const webserver = require('gulp-webserver');
const postcss      = require('gulp-postcss');
const sourcemaps   = require('gulp-sourcemaps');
const autoprefixer = require('autoprefixer');
const nano = require('cssnano');
const clean = require('gulp-clean');
const data = require('./src/data/index');

const PATH = {
  "DIST": "./dist",
  "TEMPLATES": "./src/templates/*.html",
  "JS": "./src/index.js",
  "IMG": "./src/assets/img/**/*",
  "FONTS": "./node_modules/font-awesome/fonts/**/*",
  "SASS": "./src/assets/sass/main.scss",
github posthtml / htmlnano / lib / modules / removeUnusedCss.es6 View on Github external
return new Promise((resolve, reject) => {
        options.raw = css;
        uncss(html, options, (error, output) => {
            if (error) {
                reject(error);
                return;
            }
            resolve(output);
        });
    });
}

uncss

Remove unused CSS styles

MIT
Latest version published 4 years ago

Package Health Score

60 / 100
Full package analysis

Popular uncss functions