alleyinteractive / sasslint-webpack-plugin

A webpack plugin to lint your SCSS/SASS code
MIT License
33 stars 12 forks source link

Notice: We are no longer actively developing (or updating) this plugin, we have switch to using Stylelint via the Webpack Plugin here.

NOTE Due to how non-js files are handled via webpack, this has been forked from sasslint-loader and rewritten as plugin instead of a loader.

Sasslint Plugin

Sasslint plugin for Webpack

Install

$ npm install sasslint-webpack-plugin

Usage

In your webpack configuration

var sassLintPlugin = require('sasslint-webpack-plugin');

module.exports = {
  // ...
  plugins: [
    new sassLintPlugin(),
  ],
  // ...
}

Options

You can customize the lint settings via a .sass-lint.yml file. See sasslint options, for complete options.

// Default settings
module.exports = {
  plugins: [
    new sassLintPlugin({
      configFile: '.sass-lint.yml',
      context: ['inherits from webpack'],
      ignoreFiles: [],
      ignorePlugins: [],
      glob: '**/*.s?(a|c)ss',
      quiet: false,
      failOnWarning: false,
      failOnError: false,
      testing: false
    }),
  ]
}

Errors and Warnings

The plugin will dump full reporting of errors and warnings. You can use the quiet option to hide files which only have warnings. quiet will not hide errors, nor will it hide warnings on files with errors.

Extract Text Plugin

You will can duplicate output of errors and warnings if you use the extract-text-webpack-plugin, add it to the ignorePlugins config option to prevent that.

NoErrorsPlugin

NoErrorsPlugin prevents Webpack from outputting anything into a bundle. So even sass-lint warnings will fail the build. No matter what error settings are used for sasslint-webpack-plugin.

So if you want to see sass-lint warnings in console during development using WebpackDevServer remove NoErrorsPlugin from webpack config.

License