diff --git a/README.md b/README.md index 2b058f7..da6661f 100644 --- a/README.md +++ b/README.md @@ -106,13 +106,13 @@ _Note: the config is tested against this example, as such the example contains p ## Installation ```bash -npm install --save-dev stylelint-config-plural stylelint-config-prettier stylelint-config-standard stylelint-config-standard-scss stylelint-high-performance-animation stylelint-images stylelint-order stylelint-8-point-grid +npm install --save-dev stylelint-config-plural stylelint-config-prettier stylelint-config-standard stylelint-config-standard-scss stylelint-high-performance-animation stylelint-images stylelint-order stylelint-8-point-grid stylelint-rem-over-px ``` OR ```bash -yarn add -D stylelint-config-plural stylelint-config-prettier stylelint-config-standard stylelint-config-standard-scss stylelint-high-performance-animation stylelint-images stylelint-order stylelint-8-point-grid +yarn add -D stylelint-config-plural stylelint-config-prettier stylelint-config-standard stylelint-config-standard-scss stylelint-high-performance-animation stylelint-images stylelint-order stylelint-8-point-grid stylelint-rem-over-px ``` ## Usage diff --git a/__tests__/index.test.js b/__tests__/index.test.js index 7eeac01..26e811c 100644 --- a/__tests__/index.test.js +++ b/__tests__/index.test.js @@ -46,7 +46,7 @@ describe('css', () => { it('correct warning text', () => { expect(result.results[0].warnings.map((w) => w.text)).toEqual([ - 'Use rem instead of px (meowtec/no-px)', + 'Expected px unit in "width: 10px" to be rem. (rem-over-px/rem-over-px)', 'Expected "color" to come before "background-color" (order/properties-order)', 'Invalid `width: 10px`. Pixel values should be divisible by 4. (plugin/8-point-grid)', 'Expected custom media query name "--FOO" to be kebab-case', @@ -59,7 +59,7 @@ describe('css', () => { it('correct rule flagged', () => { expect(result.results[0].warnings.map((w) => w.rule)).toEqual([ - 'meowtec/no-px', + 'rem-over-px/rem-over-px', 'order/properties-order', 'plugin/8-point-grid', 'custom-media-pattern', @@ -126,7 +126,7 @@ describe('scss', () => { it('correct warning text', () => { expect(result.results[0].warnings.map((w) => w.text)).toEqual([ - 'Use rem instead of px (meowtec/no-px)', + 'Expected px unit in "width: 10px" to be rem. (rem-over-px/rem-over-px)', 'Expected "color" to come before "background-color" (order/properties-order)', 'Invalid `width: 10px`. Pixel values should be divisible by 4. (plugin/8-point-grid)', 'Invalid `width: 0.1rem`. Rem values should be divisible by 0.25. (plugin/8-point-grid)', @@ -141,7 +141,7 @@ describe('scss', () => { it('correct rule flagged', () => { expect(result.results[0].warnings.map((w) => w.rule)).toEqual([ - 'meowtec/no-px', + 'rem-over-px/rem-over-px', 'order/properties-order', 'plugin/8-point-grid', 'plugin/8-point-grid', diff --git a/index.js b/index.js index 2137d61..3432818 100644 --- a/index.js +++ b/index.js @@ -13,7 +13,7 @@ module.exports = { plugins: [ 'stylelint-high-performance-animation', 'stylelint-images', - 'stylelint-no-px', + 'stylelint-rem-over-px', 'stylelint-order', ], /** @@ -31,7 +31,13 @@ module.exports = { // /** allow us to go as precise as needed */ // 'number-max-precision': null, /** no px - enforce rem */ - 'meowtec/no-px': [true, { ignore: ['1px'], ignoreFunctions: ['rem'] }], + 'rem-over-px/rem-over-px': [ + true, + { + ignore: ['1px'], + ignoreFunctions: ['rem'], + }, + ], /** properties order */ 'order/properties-order': propertyOrder, // /** 8 point grid system - 4 point base and 8 point main grid system */ diff --git a/package.json b/package.json index f6ef7fa..28dc952 100644 --- a/package.json +++ b/package.json @@ -81,8 +81,8 @@ "stylelint-config-standard-scss": "^6.1.0", "stylelint-high-performance-animation": "^1.7.0", "stylelint-images": "^2.0.1", - "stylelint-no-px": "^1.0.1", - "stylelint-order": "^6.0.1" + "stylelint-order": "^6.0.1", + "stylelint-rem-over-px": "^0.0.2" }, "devDependencies": { "@stylelint/prettier-config": "^2.0.0", @@ -110,6 +110,7 @@ "stylelint-high-performance-animation": ">=1", "stylelint-images": ">=2", "stylelint-no-unresolved-module": ">=2", - "stylelint-order": ">=6" + "stylelint-order": ">=6", + "stylelint-rem-over-px": ">=0" } } diff --git a/yarn.lock b/yarn.lock index 3bf7531..a230a0d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6373,13 +6373,6 @@ stylelint-images@^2.0.1: axios "^0.19.0" lodash "^4.17.4" -stylelint-no-px@^1.0.1: - version "1.0.1" - resolved "https://registry.yarnpkg.com/stylelint-no-px/-/stylelint-no-px-1.0.1.tgz#4d137c60a02c60514a958b43d3bb41805405a3ca" - integrity sha512-33+Gd5WFeSvEiOV8IwWMVgjzYieFg/Q4ETKeZkahSYl2V7+WMtgNT32IYYEspN402ZJv16bOciwEnG1GY2qrPA== - dependencies: - postcss-value-parser "^3.3.0 || ^4.0.2" - stylelint-order@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/stylelint-order/-/stylelint-order-6.0.1.tgz#a43349d99b38dd4e00bc9c5045794f2a73754e51" @@ -6388,6 +6381,13 @@ stylelint-order@^6.0.1: postcss "^8.4.20" postcss-sorting "^8.0.1" +stylelint-rem-over-px@^0.0.2: + version "0.0.2" + resolved "https://registry.yarnpkg.com/stylelint-rem-over-px/-/stylelint-rem-over-px-0.0.2.tgz#699241f9b109ac2d6bd4b52d6ac6d40779bc129b" + integrity sha512-RDL7Y89h7Km4QIyAnPxE+ARAqm3NnHuIR4krtjA7CTBr5H0zHgOW1T4d9hBFBwNujKCtIAsSfkHwVftmv5fkdQ== + dependencies: + postcss-value-parser "^3.3.0 || ^4.0.2" + stylelint-scss@^4.0.0: version "4.3.0" resolved "https://registry.yarnpkg.com/stylelint-scss/-/stylelint-scss-4.3.0.tgz#638800faf823db11fff60d537c81051fe74c90fa"