@primer/stylelint-config 12.9.2 → 13.0.0-rc.0a1e1bd

package/package.json

@@ -1,12 +1,22 @@
 {
   "name": "@primer/stylelint-config",
-  "version": "12.9.2",
+  "version": "13.0.0-rc.0a1e1bd",
   "description": "Sharable stylelint config used by GitHub's CSS",
-  "homepage": "http://primer.style/css/tools/linting",
   "author": "GitHub, Inc.",
   "license": "MIT",
-  "main": "index.js",
-  "repository": "primer/stylelint-config",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "browserslist": "extends @github/browserslist-config",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/primer/stylelint-config.git"
+  },
   "keywords": [
     "github",
     "primer",
@@ -15,44 +25,68 @@
     "stylelint"
   ],
   "files": [
+    "dist/",
     "property-order.js",
-    "browsers.js",
     "plugins/"
   ],
+  "engines": {
+    "node": ">16.0.0"
+  },
   "scripts": {
-    "test": "jest --coverage false",
+    "pretest": "npm run build",
+    "build": "rollup -c",
+    "clean": "rimraf dist",
+    "test": "npm run test:jest && npm run test:stylelint",
+    "test:jest": "NODE_OPTIONS=\"$NODE_OPTIONS --experimental-vm-modules\" jest --coverage false",
+    "test:stylelint": "stylelint __tests__/__fixtures__/good/",
     "lint": "eslint .",
     "release": "changeset publish"
   },
   "dependencies": {
+    "@github/browserslist-config": "^1.0.0",
+    "@primer/css": "^21.0.8",
+    "@primer/primitives": "^7.17.1",
     "anymatch": "^3.1.1",
-    "globby": "^11.0.1",
     "postcss-scss": "^4.0.2",
+    "postcss-styled-syntax": "^0.6.4",
     "postcss-value-parser": "^4.0.2",
     "string.prototype.matchall": "^4.0.2",
-    "stylelint": "^15.10.2",
-    "stylelint-config-standard": "^34.0.0",
-    "stylelint-no-unsupported-browser-features": "^7.0.0",
-    "stylelint-order": "^6.0.3",
-    "stylelint-scss": "^5.1.0",
+    "stylelint": "^16.3.1",
+    "stylelint-config-standard": "^36.0.0",
+    "stylelint-css-modules-no-global-scoped-selector": "^1.0.2",
+    "stylelint-no-unsupported-browser-features": "^8.0.0",
+    "stylelint-order": "^6.0.4",
+    "stylelint-scss": "^6.2.0",
+    "stylelint-value-no-unknown-custom-properties": "^6.0.1",
     "tap-map": "^1.0.0"
   },
+  "overrides": {
+    "stylelint-css-modules-no-global-scoped-selector": {
+      "stylelint": "$stylelint"
+    }
+  },
+  "prettier": "@github/prettier-config",
   "devDependencies": {
-    "@changesets/changelog-github": "0.4.7",
-    "@changesets/cli": "2.26.1",
-    "@github/prettier-config": "0.0.6",
-    "@primer/css": "^21.0.8",
-    "@primer/primitives": "^7.11.11",
-    "dedent": "1.5.1",
-    "eslint": "8.39.0",
-    "eslint-plugin-github": "4.8.0",
-    "eslint-plugin-jest": "27.2.3",
-    "eslint-plugin-prettier": "4.2.1",
-    "jest": "29.4.3",
-    "jest-preset-stylelint": "6.1.0",
-    "prettier": "2.8.1"
+    "@changesets/changelog-github": "^0.5.0",
+    "@changesets/cli": "2.27.1",
+    "@github/prettier-config": "^0.0.6",
+    "@rollup/plugin-commonjs": "^25.0.7",
+    "@rollup/plugin-json": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@typescript-eslint/parser": "^7.7.0",
+    "dedent": "^1.5.3",
+    "eslint": "^8.0.1",
+    "eslint-plugin-github": "^4.10.2",
+    "eslint-plugin-jest": "^28.2.0",
+    "eslint-plugin-prettier": "^5.1.3",
+    "jest": "^29.7.0",
+    "jest-preset-stylelint": "^7.0.0",
+    "prettier": "^3.2.5",
+    "rimraf": "^5.0.5",
+    "rollup": "^4.14.3"
   },
   "jest": {
+    "transform": {},
     "preset": "jest-preset-stylelint",
     "collectCoverage": true,
     "collectCoverageFrom": [
@@ -64,7 +98,8 @@
     ],
     "testPathIgnorePatterns": [
       "/node_modules/",
-      "__tests__/utils"
+      "__tests__/utils",
+      "__tests__/__fixtures__"
     ]
   }
 }

package/plugins/README.md

@@ -7,11 +7,6 @@ This directory contains all of our custom stylelint plugins, each of which provi
 - [Primer stylelint plugins](#primer-stylelint-plugins)
     - [Rules](#rules)
   - [Usage](#usage)
-  - [`primer/no-override`](#primerno-override)
-  - [`primer/no-unused-vars`](#primerno-unused-vars)
-  - [`primer/no-deprecated-colors`](#primerno-deprecated-colors)
-  - [`primer/no-undefined-vars`](#primerno-undefined-vars)
-  - [`primer/no-scale-colors`](#primerno-scale-colors)
   - [`primer/colors`](#primercolors)
   - [`primer/spacing`](#primerspacing)
   - [`primer/typography`](#primertypography)
@@ -33,131 +28,7 @@ If you're _not_ using or extending `@primer/stylelint-config`, you can still ref
 ```js
 // stylelint.config.js
 module.exports = {
-  plugins: ['@primer/stylelint-config/plugins/no-override', '@primer/stylelint-config/plugins/no-unused-vars']
-}
-```
-
-## `primer/no-override`
-
-This rule prohibits "overriding" class selectors defined in [Primer CSS]. By default, it will only fail selectors that target utility classes:
-
-```scss
-// FAIL
-.mt-0 {
-  /* literally anything */
-}
-```
-
-You can further constrain overrides to exclude _any_ class selector in Primer by providing additional names in the `bundles` option:
-
-```js
-// stylelint.config.js
-module.exports = {
-  // ...
-  rules: {
-    'primer/no-override': [
-      true,
-      {
-        bundles: ['utilities', core', 'product', 'marketing']
-      }
-    ]
-  }
-}
-```
-
-## `primer/no-unused-vars`
-
-This rule helps you find SCSS variables that _may_ not be used, and can be safely deleted. It works by scanning all of the SCSS files in your project and looking for anything that appears to be either a Sass variable declaration or reference:
-
-```scss
-    $name: value;
-/**      ↑
- *  The colon is what makes this a declaration */
-
-/* Anything starting with a $ and followed by word chars or hyphens
- * and _not_ followed by a colon is considered a reference: */
-
-    margin: $value;
-/**               ↑
- *                Not a colon */
-    padding: $value 1px;
-/**                ↑
- *                 Not a colon */
-
-@media screen and (max-width: $break-lg) {
-/**                                    ↑
- *                                     Also not a colon */
-```
-
-Equipped with a list of all the variable declarations and references, the linting rule walks all of the declarations in the
-file being linted, finds any that look like declarations (using the same pattern as the project-wide scan), and generates a warning for any that have zero references in the files it's scanned.
-
-Because there isn't any good way for a stylelint plugin to know all of the files being linted, it needs to be told where to find all of the declarations and references in its options:
-
-- `files` is a single path, glob, or array of paths and globs, that tells the plugin which files to scan relative to the current working directory. The default is `['**/*.scss', '!node_modules']`, which tells [globby] to find all the `.scss` files recursively and ignore the `node_modules` directory.
-
-- `variablePattern` is a regular expression that matches a single variable in either a source file string or the `prop` of a postcss Declaration node (`{type: 'decl'}`). The default matches Sass/SCSS variables: `/\$[-\w]/g`. Note that the `g` ("global") flag is _required_ to match multiple variable references on a single line.
-
-- `verbose` is a boolean that enables chatty `console.warn()` messages telling you what the plugin found, which can aid in debugging more complicated project layouts.
-
-## `primer/no-deprecated-colors`
-
-This rule identifies deprecated color variables from [primer/primitives]](https://github.com/primer/primitives) deprecated.json file and suggests replacements.
-
-```scss
-body {
-  color: var(--color-fg-default);
-}
-/**          ↑
- *           OK: --color-text-primary is defined */
-
-body {
-  color: var(--color-text-primary);
-}
-/**          ↑
- *           FAIL: --color-text-primary is deprecated. */
-```
-
-## `primer/no-undefined-vars`
-
-This rule prohibits any usages of undefined CSS variables.
-
-```scss
-:root {
-  --color-text-primary: #000;
-}
-
-body {
-  color: var(--color-text-primary);
-}
-/**          ↑
- *           OK: --color-text-primary is defined */
-
-body {
-  color: var(--color-foo);
-}
-/**          ↑
- *           FAIL: --color-foo is not defined */
-```
-
-For the purposes of this rule, a CSS variable declaration is any text starting with `--` and immediately followed by a colon.
-
-Because there isn't a good way for a stylelint plugin to know what CSS variables are defined, it needs to be told where to look for declarations in its options:
-
-- `files` is a single path, glob, or array of paths and globs, that tells the plugin which files (relative to the current working directory) to scan for CSS variable declarations. The default is `['**/*.scss', '!node_modules']`, which tells [globby] to find all the `.scss` files recursively and ignore the `node_modules` directory.
-- `verbose` is a boolean that enables chatty `console.warn()` messages telling you what the plugin found, which can aid in debugging more complicated project layouts.
-
-## `primer/no-scale-colors`
-
-This rule prohibits the use of [non-functional scale CSS variables](https://primer.style/css/support/color-system#color-palette) like `var(--color-scale-blue-1)` in all cases except the `color-variables` mixin.
-
-```scss
-// Okay; using scale colors while defining new variables
-@include color-scale-var('new-var-name', var(--color-scale-blue-1), var(--color-scale-blue-2))
-
-// Fail; using scale colors directly as a property value
-.selector {
-  color: var(--color-scale-blue-1)
+  plugins: ['@primer/stylelint-config/plugins/colors']
 }
 ```
 
@@ -377,5 +248,4 @@ module.exports = {
 - `disableFix` is a boolean that can disable auto-fixing of this rule when running `stylelint --fix` to auto-fix other rules.
 
 [primer css]: https://primer.style/css
-[globby]: https://www.npmjs.com/package/globby
 [glob patterns]: http://tldp.org/LDP/GNU-Linux-Tools-Summary/html/x11655.htm

package/plugins/borders.js

@@ -1,6 +1,6 @@
-const {createVariableRule} = require('./lib/variable-rules')
+import {createVariableRule} from './lib/variable-rules.js'
 
-module.exports = createVariableRule(
+export default createVariableRule(
   'primer/borders',
   {
     border: {

package/plugins/box-shadow.js

@@ -1,6 +1,6 @@
-const {createVariableRule} = require('./lib/variable-rules')
+import {createVariableRule} from './lib/variable-rules.js'
 
-module.exports = createVariableRule(
+export default createVariableRule(
   'primer/box-shadow',
   {
     'box shadow': {

package/plugins/colors.js

@@ -1,4 +1,4 @@
-const {createVariableRule} = require('./lib/variable-rules')
+import {createVariableRule} from './lib/variable-rules.js'
 
 const bgVars = [
   '$bg-*',
@@ -12,7 +12,7 @@ const bgVars = [
   /var\((.+-)*iconColor(-.+)*\)/,
 ]
 
-module.exports = createVariableRule(
+export default createVariableRule(
   'primer/colors',
   {
     'background-color': {

package/plugins/lib/decl-validator.js

@@ -1,11 +1,11 @@
-const anymatch = require('anymatch')
-const valueParser = require('postcss-value-parser')
-const TapMap = require('tap-map')
+import anymatch from 'anymatch'
+import valueParser from 'postcss-value-parser'
+import TapMap from 'tap-map'
 
 const SKIP_VALUE_NODE_TYPES = new Set(['space', 'div'])
 const SKIP_AT_RULE_NAMES = new Set(['each', 'for', 'function', 'mixin'])
 
-module.exports = function declarationValidator(rules, options = {}) {
+export default function declarationValidator(rules, options = {}) {
   const {formatMessage = defaultMessageFormatter, variables, verbose = false} = options
   const variableReplacements = new TapMap()
   if (variables) {

package/plugins/lib/primer-utilities.js

@@ -1,7 +1,7 @@
 // Meant as temp until we can move to primitives or css
 const colorTypes = ['accent', 'success', 'attention', 'severe', 'danger', 'open', 'closed', 'done', 'sponsors']
 
-module.exports = {
+export default {
   color: [
     {
       value: 'var(--color-fg-default)',

package/plugins/lib/primitives.js

@@ -0,0 +1,33 @@
+import {createRequire} from 'node:module'
+
+const require = createRequire(import.meta.url)
+
+export async function primitivesVariables(type) {
+  const variables = []
+
+  const files = []
+  switch (type) {
+    case 'size':
+      files.push('base/size/size.json')
+      break
+  }
+
+  for (const file of files) {
+    // eslint-disable-next-line import/no-dynamic-require
+    const data = require(`@primer/primitives/dist/styleLint/${file}`)
+
+    for (const key of Object.keys(data)) {
+      const size = data[key]
+      const values = size['value']
+      values.push(`${parseInt(size['original']['value']) + 1}px`)
+      values.push(`${parseInt(size['original']['value']) - 1}px`)
+
+      variables.push({
+        name: `--${size['name']}`,
+        values,
+      })
+    }
+  }
+
+  return variables
+}

package/plugins/lib/variable-rules.js

@@ -1,27 +1,12 @@
-const stylelint = require('stylelint')
-const {requirePrimerFile} = require('./primer')
-const declarationValidator = require('./decl-validator')
+import stylelint from 'stylelint'
+import declarationValidator from './decl-validator.js'
+import variables from '@primer/css/dist/variables.json' with {type: 'json'}
 
-const CSS_IMPORTANT = '!important'
-const CSS_DIRECTIONS = ['top', 'right', 'bottom', 'left']
-const CSS_CORNERS = ['top-right', 'bottom-right', 'bottom-left', 'top-left']
-
-module.exports = {
-  createVariableRule,
-  CSS_DIRECTIONS,
-  CSS_CORNERS,
-  CSS_IMPORTANT,
-}
-
-function createVariableRule(ruleName, rules, url) {
-  let variables = {}
-  try {
-    variables = requirePrimerFile('dist/variables.json')
-  } catch (error) {
-    // eslint-disable-next-line no-console
-    console.warn(`Unable to get variables.json from @primer/css. Replacements will need to be specified manually.`)
-  }
+export const CSS_IMPORTANT = '!important'
+export const CSS_DIRECTIONS = ['top', 'right', 'bottom', 'left']
+export const CSS_CORNERS = ['top-right', 'bottom-right', 'bottom-left', 'top-left']
 
+export function createVariableRule(ruleName, rules, url) {
   const plugin = stylelint.createPlugin(ruleName, (enabled, options = {}, context) => {
     if (enabled === false) {
       return noop

package/plugins/no-display-colors.js

@@ -1,8 +1,8 @@
-const stylelint = require('stylelint')
-const matchAll = require('string.prototype.matchall')
+import stylelint from 'stylelint'
+import matchAll from 'string.prototype.matchall'
 
-const ruleName = 'primer/no-display-colors'
-const messages = stylelint.utils.ruleMessages(ruleName, {
+export const ruleName = 'primer/no-display-colors'
+export const messages = stylelint.utils.ruleMessages(ruleName, {
   rejected: varName => `${varName} is in alpha and should be used with caution with approval from the Primer team`,
 })
 
@@ -10,7 +10,7 @@ const messages = stylelint.utils.ruleMessages(ruleName, {
 // eslint-disable-next-line no-useless-escape
 const variableReferenceRegex = /var\(([^\),]+)(,.*)?\)/g
 
-module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}) => {
+export default stylelint.createPlugin(ruleName, (enabled, options = {}) => {
   if (!enabled) {
     return noop
   }
@@ -48,6 +48,3 @@ module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}) => {
 })
 
 function noop() {}
-
-module.exports.ruleName = ruleName
-module.exports.messages = messages

package/plugins/responsive-widths.js

@@ -1,10 +1,10 @@
-const stylelint = require('stylelint')
-const declarationValueIndex = require('stylelint/lib/utils/declarationValueIndex')
-const valueParser = require('postcss-value-parser')
+import stylelint from 'stylelint'
+import declarationValueIndex from 'stylelint/lib/utils/declarationValueIndex.cjs'
+import valueParser from 'postcss-value-parser'
 
-const ruleName = 'primer/responsive-widths'
+export const ruleName = 'primer/responsive-widths'
 
-const messages = stylelint.utils.ruleMessages(ruleName, {
+export const messages = stylelint.utils.ruleMessages(ruleName, {
   rejected: value => {
     return `A value larger than the smallest viewport could break responsive pages. Use a width value smaller than ${value}. https://primer.style/css/support/breakpoints`
   },
@@ -24,7 +24,7 @@ const walkGroups = (root, validate) => {
 }
 
 // eslint-disable-next-line no-unused-vars
-module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}, context) => {
+export default stylelint.createPlugin(ruleName, (enabled, options = {}, context) => {
   if (!enabled) {
     return noop
   }
@@ -93,6 +93,3 @@ module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}, contex
 })
 
 function noop() {}
-
-module.exports.ruleName = ruleName
-module.exports.messages = messages

package/plugins/spacing.js

@@ -1,39 +1,12 @@
-const stylelint = require('stylelint')
-const declarationValueIndex = require('stylelint/lib/utils/declarationValueIndex')
-const valueParser = require('postcss-value-parser')
-
-// TODO: Pull this in from primer/primitives
-const spacerValues = {
-  '$spacer-1': '4px',
-  '$spacer-2': '8px',
-  '$spacer-3': '16px',
-  '$spacer-4': '24px',
-  '$spacer-5': '32px',
-  '$spacer-6': '40px',
-  '$spacer-7': '48px',
-  '$spacer-8': '64px',
-  '$spacer-9': '80px',
-  '$spacer-10': '96px',
-  '$spacer-11': '112px',
-  '$spacer-12': '128px',
-  '$em-spacer-1': '0.0625em',
-  '$em-spacer-2': '0.125em',
-  '$em-spacer-3': '0.25em',
-  '$em-spacer-4': '0.375em',
-  '$em-spacer-5': '0.5em',
-  '$em-spacer-6': '0.75em',
-}
+import stylelint from 'stylelint'
+import declarationValueIndex from 'stylelint/lib/utils/declarationValueIndex.cjs'
+import valueParser from 'postcss-value-parser'
+import {primitivesVariables} from './lib/primitives.js'
 
-const ruleName = 'primer/spacing'
-const messages = stylelint.utils.ruleMessages(ruleName, {
-  rejected: (value, replacement) => {
-    if (replacement === null) {
-      return `Please use a primer spacer variable instead of '${value}'. Consult the primer docs for a suitable replacement. https://primer.style/css/support/spacing`
-    }
-
-    return `Please replace ${value} with spacing variable '${replacement}'.`
-  },
-})
+const {
+  createPlugin,
+  utils: {report, ruleMessages, validateOptions},
+} = stylelint
 
 const walkGroups = (root, validate) => {
   for (const node of root.nodes) {
@@ -46,24 +19,47 @@ const walkGroups = (root, validate) => {
   return root
 }
 
-// eslint-disable-next-line no-unused-vars
-module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}, context) => {
-  if (!enabled) {
-    return noop
-  }
+export const ruleName = 'primer/spacing'
+export const messages = ruleMessages(ruleName, {
+  rejected: (value, replacement) => {
+    if (!replacement) {
+      return `Please use a primer size variable instead of '${value}'. Consult the primer docs for a suitable replacement. https://primer.style/foundations/primitives/size`
+    }
 
-  const lintResult = (root, result) => {
-    root.walk(decl => {
-      if (decl.type !== 'decl' || !decl.prop.match(/^(padding|margin)/)) {
-        return noop
-      }
+    return `Please replace '${value}' with size variable '${replacement['name']}'. https://primer.style/foundations/primitives/size`
+  },
+})
 
-      const problems = []
+const meta = {
+  fixable: true,
+}
 
-      const parsedValue = walkGroups(valueParser(decl.value), node => {
-        // Remove leading negative sign, if any.
-        const cleanValue = node.value.replace(/^-/g, '')
+/** @type {import('stylelint').Rule} */
+const ruleFunction = (primary, secondaryOptions, context) => {
+  return async (root, result) => {
+    // Props that we want to check
+    const propList = ['padding', 'margin', 'top', 'right', 'bottom', 'left']
+    // Values that we want to ignore
+    const valueList = ['${']
 
+    const sizes = await primitivesVariables('size')
+
+    const validOptions = validateOptions(result, ruleName, {
+      actual: primary,
+      possible: [true],
+    })
+
+    if (!validOptions) return
+
+    root.walkDecls(declNode => {
+      const {prop, value} = declNode
+
+      if (!propList.some(spacingProp => prop.startsWith(spacingProp))) return
+      if (valueList.some(valueToIgnore => value.includes(valueToIgnore))) return
+
+      const problems = []
+
+      const parsedValue = walkGroups(valueParser(value), node => {
         // Only check word types. https://github.com/TrySound/postcss-value-parser#word
         if (node.type !== 'word') {
           return
@@ -74,30 +70,36 @@ module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}, contex
           return
         }
 
-        const valueUnit = valueParser.unit(cleanValue)
+        const valueUnit = valueParser.unit(node.value)
+
+        if (valueUnit && (valueUnit.unit === '' || !/^-?[0-9.]+$/.test(valueUnit.number))) {
+          return
+        }
 
-        if (valueUnit && (valueUnit.unit === '' || !/^[0-9.]+$/.test(valueUnit.number))) {
+        // Skip if the value unit isn't a supported unit.
+        if (valueUnit && !['px', 'rem', 'em'].includes(valueUnit.unit)) {
           return
         }
 
-        // If the a variable is found in the value, skip it.
+        // If the variable is found in the value, skip it.
         if (
-          Object.keys(spacerValues).some(variable =>
-            new RegExp(`${variable.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')}\\b`).test(cleanValue),
+          sizes.some(variable =>
+            new RegExp(`${variable['name'].replace(/[.*+?^${}()|[\]\\]/g, '\\$&')}\\b`).test(node.value),
           )
         ) {
           return
         }
 
-        const replacement = Object.keys(spacerValues).find(spacer => spacerValues[spacer] === cleanValue) || null
-        const valueMatch = replacement ? spacerValues[replacement] : node.value
+        const replacement = sizes.find(variable => variable.values.includes(node.value.replace('-', '')))
+        const fixable = replacement && valueUnit && !valueUnit.number.includes('-')
 
-        if (replacement && context.fix) {
-          node.value = node.value.replace(valueMatch, replacement)
+        if (fixable && context.fix) {
+          node.value = node.value.replace(node.value, `var(${replacement['name']})`)
         } else {
           problems.push({
-            index: declarationValueIndex(decl) + node.sourceIndex,
-            message: messages.rejected(valueMatch, replacement),
+            index: declarationValueIndex(declNode) + node.sourceIndex,
+            endIndex: declarationValueIndex(declNode) + node.sourceIndex + node.value.length,
+            message: messages.rejected(node.value, replacement),
           })
         }
 
@@ -105,15 +107,16 @@ module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}, contex
       })
 
       if (context.fix) {
-        decl.value = parsedValue.toString()
+        declNode.value = parsedValue.toString()
       }
 
       if (problems.length) {
         for (const err of problems) {
-          stylelint.utils.report({
+          report({
             index: err.index,
+            endIndex: err.endIndex,
             message: err.message,
-            node: decl,
+            node: declNode,
             result,
             ruleName,
           })
@@ -121,11 +124,10 @@ module.exports = stylelint.createPlugin(ruleName, (enabled, options = {}, contex
       }
     })
   }
+}
 
-  return lintResult
-})
-
-function noop() {}
+ruleFunction.ruleName = ruleName
+ruleFunction.messages = messages
+ruleFunction.meta = meta
 
-module.exports.ruleName = ruleName
-module.exports.messages = messages
+export default createPlugin(ruleName, ruleFunction)