stylelint-browser-compat

1.0.0-beta.120 • Public • Published

stylelint-browser-compat

stylelint-browser-compat

github sponsors npm license standard-readme compliant

Yet another linter rule to detect compatibility of CSS features.

This plugin checks if the CSS you're using is supported by the browsers you're targeting. It uses @mdn/browser-compat-data to detect browser support.

⚠️ This plugin is beta. USE AT YOUR OWN RISK.

Table of Contents

Background

stylelint-no-unsupported-browser-features (using doiuse) is available to detect compatibility of CSS features.

However, doiuse have not been maintained for a long time.

This library provides another alternative to detect compatibility of CSS features.

Although doiuse detects compatibility from caniuse data, this library uses @mdn/browser-compat-data to do so.

Install

$ npm install --dev browserslist stylelint stylelint-browser-compat
$ yarn add --dev browserslist stylelint stylelint-browser-compat

Usage

module.exports = {
  plugins: ['stylelint-browser-compat'],
  rules: {
    'plugin/browser-compat': [
      true,
      {
        allow: {
          features: ['at-rules.supports'],
          flagged: false,
          partialImplementation: false,
          prefix: true,
        },
        browserslist: ['last 2 versions'],
      },
    ],
  },
};

Options

  • browserslist (string or array, optional)
    • Accepts browserslist queries for target browsers.
    • By default, browserslist automatically loads the configuration file (e.g. package.json, .browserslistrc).
  • allow.features (array, optional)
    • Accepts an array of features to allow.
    • Feature names are from @mdn/browser-compat-data.
      • For example, if you want to use @supports at-rules, pass at-rules.supports.
  • allow.flagged (boolean, optional)
    • Allows features that are available when the browser's feature flags is enabled.
    • false by default
  • allow.partialImplementation (boolean, optional)
    • Allows features that are partial implementations.
    • false by default
  • allow.prefix (boolean, optional)
    • Allows features with vendor prefix.
    • true by default

Contributing

PRs accepted.

License

MIT (c) 3846masa

Package Sidebar

Install

npm i stylelint-browser-compat

Weekly Downloads

5,136

Version

1.0.0-beta.120

License

MIT

Unpacked Size

210 kB

Total Files

114

Last publish

Collaborators

  • 3846masa