gulp-csslint-scss-reporter
v0.0.1
Published
A console reporter for csslint that maps errors back to the original scss files using sourcemaps
Downloads
20
Maintainers
Readme
gulp-csslint-scss-reporter
A console reporter for csslint that maps errors back to the original scss files using scss source maps.
Installation
Install gulp-csslint-scss-reporter
as a development dependency.
npm install --save-dev gulp-csslint-scss-reporter
gulp-csslint
, gulp-sourcemaps
, and gulp-sass
should also be installed.
Usage
Scss source maps are required in order to map errors back onto the original scss
files. If scss source maps are not available, an error will be thrown.
var gulp = require('gulp');
var sass = require('gulp-sass');
var csslint = require('gulp-csslint');
var sourcemaps = require('gulp-sourcemaps');
var scssReporter = require('gulp-csslint-scss-reporter');
gulp.task('sass', function () {
return gulp.src('src/**/*.scss')
.pipe(sourcemaps.init()) // sourcemaps are required
.pipe(sass())
.pipe(csslint())
.pipe(scssReporter())
.pipe(gulp.dest('build'));
});
API
scssReporter()
Errors will be reported in all files and @imports
.
scssReporter(pattern)
pattern
Type: String
or Array
A valid pattern
for globule.isMatch()
.
If an error is in an imported file, you can specify a whitelist pattern
to filter out unwanted errors in the imported files. Only imported files that match the pattern will emit errors. This only applies to imports, any file that is in the pipeline directly will always have linting errors reported.
For example, if you @import
an external sass/scss file from bower_components
and don't care about linting errors in it, you can whitelist the results to only your sources.
src/example.scss
@import "bower_components/my-module/src/hello.scss";
@import "bower_components/my-module/src/world.scss";
gulpfile.js
var gulp = require('gulp');
var sourcemaps = require('gulp-sourcemaps');
var sass = require('gulp-sass');
var csslint = require('gulp-csslint');
var scssReporter = require('gulp-csslint-scss-reporter');
gulp.task('sass', function () {
return gulp.src('src/**/*.scss')
.pipe(sourcemaps.init()) // sourcemaps are required
.pipe(sass())
.pipe(csslint())
.pipe(sassReporter('src/**/*.scss')) // errors in bower_components will be ignored
.pipe(gulp.dest('build'));
});
Error Handling
Errors will be written to the console as they are encountered. An exception will be thrown after reporting all errors.
To capture that exception so that the pipline will continue, add a listener to the error
event and then you can handle the error as you like.
var gulp = require('gulp');
var sourcemaps = require('gulp-sourcemaps');
var sass = require('gulp-sass');
var csslint = require('gulp-csslint');
var scssReporter = require('gulp-csslint-scss-reporter');
var shouldThrow = true;
gulp.task('sass', function () {
return gulp.src('src/**/*.scss')
.pipe(sourcemaps.init()) // sourcemaps are required
.pipe(sass())
.pipe(csslint())
.pipe(scssReporter())
.on('error', function (err) {
// decide whether to throw the error
if (shouldThrow) {
throw err;
}
})
.pipe(gulp.dest('build'));
});