ramasilveyra / stylelint-images Goto Github PK

View Code? Open in Web Editor NEW

34.0 6.0 7.0 682 KB

Check your CSS images to improve the performance and avoid common mistakes (plugin pack).

License: MIT License

JavaScript 100.00%

stylelint-images's Introduction

stylelint-images

A collection of rules to check images for stylelint (in a form of a plugin).

Installation
Usage
- List of rules
Contribute
License

Installation

stylelint-images is a plugin for stylelint, so it's meant to be used with it.

Node.js v6 or newer is required. That's because stylelint itself doesn't support Node.js versions below 6.

First, install stylelint-images (and stylelint, if you haven't done so yet) via NPM:

npm install -D stylelint@^9.1.0 stylelint-images

Or if you use Yarn:

yarn add stylelint@^9.1.0 stylelint-images -D

Usage

Create the .stylelintrc.json config file (or open the existing one), add stylelint-images to the plugins array and the rules you need to the rules list. All rules from stylelint-images need to be namespaced with images.

{
  "plugins": [
    "stylelint-images"
  ],
  "rules": {
    "images/broken": true,
    "images/prefer-data-uri": 256,
    ...
  }
}

Please refer to stylelint docs for the detailed info on using this linter.

List of rules

broken: Checks if the images are broken.
prefer-data-uri: Suggest using data-URIs instead of an external image if its file size (in bytes) is smaller than the limit.

Contribute

Feel free to dive in! Open an issue or submit PRs.

stylelint-images follows the Contributor Covenant Code of Conduct.

License

stylelint-images is MIT licensed.

stylelint-images's People

Contributors

Stargazers

Watchers

Forkers

classheroes uxigene shuttlerock-archive fxy-during yhafez andrey-kudinov

stylelint-images's Issues

A new Security vulnerability detected with axios

Hi, it looks like there is a new High severity vulnerability with axios. Is it possible to update the version in this package, because the vulnerability cannot be fixed with npm audit fix?

                       === npm audit security report ===                        
                                                                                
┌──────────────────────────────────────────────────────────────────────────────┐
│                                Manual Review                                 │
│            Some vulnerabilities require your attention to resolve            │
│                                                                              │
│         Visit https://go.npm.me/audit-guide for additional guidance          │
└──────────────────────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High          │ Server-Side Request Forgery                                  │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ axios                                                        │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=0.21.1                                                     │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ stylelint-images [dev]                                       │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ stylelint-images > axios                                     │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://npmjs.com/advisories/1594                            │
└───────────────┴──────────────────────────────────────────────────────────────┘

Support for local images?

Any reason this plugin doesn't support locally hosted images? It seems like it'd be beneficial to be able to test if an image reference exists or not, while developing.

Happy to do the work and create an MR if you'd like.
-E

Update to support newer version of Stylelint

Security vulnerability detected for axios

There is a Moderate vulnerability warning being caused by an outdated dependency in this project.

This is what I get when I run npm audit on my project that has stylelint-images as a dependency.

Moderate	Denial of Service
Package	axios
Patched in	>=0.18.1
Dependency of	stylelint-images [dev]
Path	stylelint-images > axios
More info	https://npmjs.com/advisories/880

This issue cannot be fixed automatically with npm audit fix and has to be fixed here. Is it possible to update this package here?

Improve line and column precision with a value postcss parser

Maybe using https://github.com/shellscape/postcss-values-parser

Add rule to warn with unoptimized files

Name: images/unoptimized

Reference: https://github.com/sindresorhus/gulp-imagemin/

Also add a rule option to pass custom imagemin options, maybe something like pointing to a file with the custom options. E.g.:

    "images/unoptimized": [true, {
      "imagemin-options-file": "./config/imagemin.js"
    }]

./config/imagemin.js:

'use strict';

const { gifsicle, jpegtran, optipng, svgo } = require('stylelint-images');

module.exports = [
  gifsicle(),
  jpegtran(),
  optipng(),
  svgo({ plugins: [{ removeUselessDefs: false }] })
];

Also cache the optimized result.