GithubHelp home page GithubHelp logo

isabella232 / sasslint-webpack-plugin Goto Github PK

View Code? Open in Web Editor NEW

This project forked from alleyinteractive/sasslint-webpack-plugin

0.0 0.0 0.0 40 KB

A webpack plugin to lint your SCSS/SASS code

License: MIT License

JavaScript 88.02% SCSS 11.75% Sass 0.23%

sasslint-webpack-plugin's Introduction

##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.

  • configFile: You can change the config file location. Default: (.sass-lint.yml)
  • context: Array of strings or String, Change the root of your SCSS files. Default inherits from webpack config.
  • ignoreFiles: Array of files to ignore, must be full path, Default: none
  • ignorePlugins: Array of plugins to ignore, Default: none (example: extract-text-webpack-plugin)
  • glob: Change the glob pattern for finding files. Default: (**/*.s?(a|c)ss)
  • quiet: Suppress warnings, errors will still show. Default: false
  • failOnWarning: Have Webpack's build process die on warning. Default: false
  • failOnError: Have Webpack's build process die on error. Default: false
  • testing: Quites output normally for testing purposes, Default: 'false' Caution do not use this unless you are catching errors via Webpack CLI!
// 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

sasslint-webpack-plugin's People

Contributors

dmachat avatar jackmarketon avatar karlhorky avatar randycoulman avatar sompylasar avatar yangshun avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.