cssProcessor: cssnano({ safe: true }),
}), new OptimizeCssAssetsPlugin({ assetNameRegExp: /\.css$/g, cssProcessor: cssnano({ safe: true }),
gulp.task('vendor:styles', () => gulp.src(`${src}/assets/styles/vendor/vendor.scss`) .pipe(when(!production, sourcemaps.init())) .pipe(sass({ importer: moduleImporter() })) .pipe(postcss([ autoprefixer({ browsers }), ])) .pipe(concat('vendor.css')) .pipe(when(!production, sourcemaps.write('.'))) .on('error', onError) .pipe(gulp.dest(`${dist}/assets/css`)) )
extractTextWebpackPluginInstance.extract({ use: [ { loader: 'css-loader', options: { minimize: true, importLoaders: 1 } }, { loader: 'postcss-loader', options: { ident: 'postcss', plugins: (loader) => [ postcssAutoprefixer({browsers: ['since 2012']}) ] } }, { loader: 'sass-loader' } ], fallback: 'style-loader', publicPath: publicPathName })
function getCommonStyleLoaders(enableModules) { let cssOptions = {}; if (enableModules) { cssOptions = { sourceMap: true, modules: true, importLoaders: 1, localIdentName: '[name]__[local]___[hash:base64:5]' }; } return [ { loader: 'css-loader', options: cssOptions }, { loader: 'postcss-loader', options: { sourceMap: true, plugins: () => [autoprefixer({ browsers: ['last 2 versions'] })] } }, { loader: 'resolve-url-loader' }, ]; }
gulp.task('css', function () { return gulp.src('./test/src/css/**/*.css') .pipe(postcss([lazyimagecss({ imagePath: ['../img', '../slice'] })])) .pipe(gulp.dest('./test/dist/css')); });
async processCss(assetName, asset, assets) { let css = asset.source(); css = await postcss([autoprefixer({browsers: this.options.browsers})]).process(css).css; const result = csso.minify(css, Object.assign({filename: assetName}, this.options)); css = result.css; if (this.options.sourceMap) { assets.setAsset(`${assetName}.map`, result.map.toString()); css += `/*# sourceMappingURL=${path.basename(assetName)}.map */`; } return css; }
// sass gulp.task("sass", function() { const postcss = require("gulp-postcss"); const autoprefixer = require("autoprefixer"); const sass = require("gulp-sass"); return gulp.src("./public/app/style.scss") .pipe(sass().on("error", sass.logError)) .pipe(postcss([ autoprefixer({ browsers: ["last 8 Chrome versions"] }) ])) .pipe(gulp.dest("./public/app/")); });
cssProcessor: cssnano({ safe: true }),
}), new OptimizeCssAssetsPlugin({ assetNameRegExp: /\.css$/g, cssProcessor: cssnano({ safe: true }),
async processCss(assetName, asset, assets) { let css = asset.source(); css = await postcss([autoprefixer({browsers: this.options.browsers})]).process(css).css; const result = csso.minify(css, Object.assign({filename: assetName}, this.options)); css = result.css; if (this.options.sourceMap) { assets.setAsset(`${assetName}.map`, result.map.toString()); css += `/*# sourceMappingURL=${path.basename(assetName)}.map */`; } return css; }