stylelint-tokens

A Stylelint plugin that helps avoid the adoption of unofficial design specifications.

Installation

yarn add @tempera/stylelint-tokens

Usage

Install Stylelint and update your configuration file to utilize the plugin.

// stylelint.config.js
const tokens = require("./fixtures/example-tokens");

module.exports = {
  // ...
  plugins: ["@tempera/stylelint-tokens"],
  rules: {
    "@tempera/official-specs": tokens,
  },
};

Tokens

The plugin expects these tokens to be in the javascript/es6 format which you can generate using Style Dictionary except exported as CommonJS modules.

In other words, flat CommonJS modules in PascalCase are expected.

Example:

module.exports.ColorBackgroundBase = "#ffffff";
module.exports.ColorBackgroundAlt = "#fcfcfcfc";

Support for tokens in ES6 format is on the roadmap.

View the source)