Follow stylelint-config-recommended-scss v6 (#29)

* Support for stylelint-scss v4.2

* fix tests

* update

* update test

* fix

lib/get-module-version.js

@@ -0,0 +1,57 @@
+"use strict"
+
+const path = require("path")
+
+/**
+ * Gets the module version from package name
+ */
+module.exports = function getModuleVersion(...moduleNames) {
+    const packageName = moduleNames.pop()
+
+    let ownerModuleRootPath = process.cwd()
+    for (const ownerNames of moduleNames) {
+        ownerModuleRootPath =
+            getModuleRootPath(ownerNames, ownerModuleRootPath) ||
+            ownerModuleRootPath
+    }
+    try {
+        const m = require("module")
+        const relativeTo = path.join(ownerModuleRootPath, "__placeholder__.js")
+        // eslint-disable-next-line node/no-unsupported-features/node-builtins -- ignore
+        return m.createRequire(relativeTo)(`${packageName}/package.json`)
+            .version
+    } catch {
+        // ignore
+    }
+    try {
+        return require(`${packageName}/package.json`).version
+    } catch {
+        // ignore
+    }
+
+    return null
+}
+
+/**
+ * Get module root path
+ */
+function getModuleRootPath(packageName, ownerModuleRootPath) {
+    try {
+        const m = require("module")
+        const relativeTo = path.join(ownerModuleRootPath, "__placeholder__.js")
+
+        return path.dirname(
+            // eslint-disable-next-line node/no-unsupported-features/node-builtins -- ignore
+            m.createRequire(relativeTo).resolve(`${packageName}/package.json`),
+        )
+    } catch {
+        // ignore
+    }
+    try {
+        return path.dirname(require.resolve(`${packageName}/package.json`))
+    } catch {
+        // ignore
+    }
+
+    return null
+}

lib/vue-specific-rules-for-scss.js

@@ -0,0 +1,10 @@
+"use strict"
+
+const baseRules = require("./vue-specific-rules")
+
+module.exports = {
+    ...baseRules,
+    ...(baseRules["function-no-unknown"]
+        ? { "function-no-unknown": null }
+        : {}),
+}

lib/vue-specific-rules.js

@@ -1,29 +1,8 @@
 "use strict"
 
-const path = require("path")
+const getModuleVersion = require("./get-module-version")
 const semver = require("semver")
-let stylelintVersion = null
-try {
-    const m = require("module")
-    const cwd = process.cwd()
-    const relativeTo = path.join(cwd, "__placeholder__.js")
-    // eslint-disable-next-line node/no-unsupported-features/node-builtins -- ignore
-    stylelintVersion = m.createRequire(relativeTo)(
-        "stylelint/package.json",
-    ).version
-} catch {
-    // ignore
-}
-if (stylelintVersion == null) {
-    try {
-        stylelintVersion = require("stylelint/package.json").version
-    } catch {
-        // ignore
-    }
-}
-if (stylelintVersion == null) {
-    stylelintVersion = "14.5.0"
-}
+const stylelintVersion = getModuleVersion("stylelint") || "14.5.0"
 
 module.exports = {
     "selector-pseudo-class-no-unknown": [

scss/index.js

@@ -8,7 +8,7 @@ module.exports = {
                 "stylelint-config-recommended-scss",
                 "stylelint-config-html",
             ],
-            rules: require("../lib/vue-specific-rules"),
+            rules: require("../lib/vue-specific-rules-for-scss"),
         },
     ],
 }

tests/fixtures/integrations/function-no-unknown/.npmrc

@@ -0,0 +1 @@
+package-lock=false

tests/fixtures/integrations/function-no-unknown/package.json

@@ -0,0 +1,15 @@
+{
+    "name": "stylelint-config-recommended-vue-test-stylelint",
+    "private": true,
+    "version": "1.0.0",
+    "description": "",
+    "devDependencies": {
+        "postcss-html": "^1.0.0",
+        "stylelint": "^14.5.0",
+        "stylelint-config-recommended": "^7.0.0",
+        "stylelint-config-recommended-vue": "file:../../../../stylelint-config-recommended-vue-test.tgz"
+    },
+    "engines": {
+        "node": "^12 || >=14"
+    }
+}

tests/fixtures/integrations/function-no-unknown/src/valid.vue

@@ -0,0 +1,14 @@
+<style>
+a {
+    color: v-bind(color);
+}
+
+:global(.foo),
+::v-deep(.foo),
+::v-slotted(.foo),
+::v-global(.foo),
+:deep(.foo),
+:slotted(.foo) {
+    color: red;
+}
+</style>

tests/fixtures/integrations/function-no-unknown/stylelint.config.js

@@ -0,0 +1,5 @@
+"use strict"
+
+module.exports = {
+    extends: "stylelint-config-recommended-vue",
+}

tests/fixtures/integrations/stylelint-config-standard-scss/package.json

@@ -7,7 +7,7 @@
         "postcss-html": "^1.0.0",
         "stylelint": "^14.0.0",
         "stylelint-config-recommended-scss": "^5.0.2",
-        "stylelint-config-recommended-vue": "file:../../../../",
+        "stylelint-config-recommended-vue": "file:../../../../stylelint-config-recommended-vue-test.tgz",
         "stylelint-config-standard-scss": "^3.0.0"
     },
     "engines": {

tests/fixtures/integrations/stylelint-config-standard-scss/src/valid.vue

@@ -1,6 +1,6 @@
 <style lang="scss">
 a {
-  color: red;
+  color: v-bind(color);
 }
 
 // SCSS

tests/fixtures/integrations/stylelint-scss-v4.1/.npmrc

@@ -0,0 +1 @@
+package-lock=false

tests/fixtures/integrations/stylelint-scss-v4.1/package.json

@@ -0,0 +1,16 @@
+{
+    "name": "stylelint-config-recommended-vue-test-stylelint",
+    "private": true,
+    "version": "1.0.0",
+    "description": "",
+    "devDependencies": {
+        "postcss-html": "^1.0.0",
+        "stylelint": "^14.0.0",
+        "stylelint-config-recommended-scss": "^5.0.2",
+        "stylelint-config-recommended-vue": "file:../../../../stylelint-config-recommended-vue-test.tgz",
+        "stylelint-scss": "4.1.0"
+    },
+    "engines": {
+        "node": "^12 || >=14"
+    }
+}

tests/fixtures/integrations/stylelint-scss-v4.1/src/invalid.vue

@@ -0,0 +1,7 @@
+<style lang="scss">
+a {
+    @if $x == null {
+        color: red;
+    }
+}
+</style>

tests/fixtures/integrations/stylelint-scss-v4.1/src/valid.vue

@@ -0,0 +1,32 @@
+<style lang="scss">
+a {
+    color: v-bind(color);
+    padding-right: math.div(4, 2);
+}
+
+// SCSS
+.b {
+    // stylelint-disable-next-line scss/at-if-no-null
+    @if $x == null {
+        color: red;
+    }
+}
+@mixin my-mixin {
+  color: blue
+}
+
+.c {
+  @include my-mixin
+}
+
+// Vue
+:global(.foo),
+::v-deep(.foo),
+::v-slotted(.foo),
+::v-global(.foo),
+:deep(.foo),
+:slotted(.foo) {
+    color: red;
+}
+
+</style>

tests/fixtures/integrations/stylelint-scss-v4.1/stylelint.config.js

@@ -0,0 +1,5 @@
+"use strict"
+
+module.exports = {
+    extends: "stylelint-config-recommended-vue/scss",
+}

tests/fixtures/integrations/stylelint-scss/package.json

@@ -6,8 +6,8 @@
     "devDependencies": {
         "postcss-html": "^1.0.0",
         "stylelint": "^14.0.0",
-        "stylelint-config-recommended-scss": "^5.0.2",
-        "stylelint-config-recommended-vue": "file:../../../../"
+        "stylelint-config-recommended-scss": "^6.0.0",
+        "stylelint-config-recommended-vue": "file:../../../../stylelint-config-recommended-vue-test.tgz"
     },
     "engines": {
         "node": "^12 || >=14"

tests/fixtures/integrations/stylelint-scss/src/valid.vue

@@ -1,6 +1,7 @@
 <style lang="scss">
 a {
-    color: red;
+    color: v-bind(color);
+    padding-right: math.div(4, 2);
 }
 
 // SCSS

tests/fixtures/integrations/stylelint-v14.3/package.json

@@ -7,7 +7,7 @@
         "postcss-html": "^1.0.0",
         "stylelint": "14.3.0",
         "stylelint-config-recommended": "^6.0.0",
-        "stylelint-config-recommended-vue": "file:../../../../stylelint-config-recommended-vue-1.3.0.tgz"
+        "stylelint-config-recommended-vue": "file:../../../../stylelint-config-recommended-vue-test.tgz"
     },
     "engines": {
         "node": "^12 || >=14"

tests/fixtures/integrations/stylelint-v14.3/src/valid.vue

@@ -1,6 +1,6 @@
 <style>
 a {
-    color: red;
+    color: v-bind(color);
 }
 
 :global(.foo),

tests/fixtures/integrations/stylelint-v14.4/package.json

@@ -7,7 +7,7 @@
         "postcss-html": "^1.0.0",
         "stylelint": "14.4.0",
         "stylelint-config-recommended": "^7.0.0",
-        "stylelint-config-recommended-vue": "file:../../../../stylelint-config-recommended-vue-1.3.0.tgz"
+        "stylelint-config-recommended-vue": "file:../../../../stylelint-config-recommended-vue-test.tgz"
     },
     "engines": {
         "node": "^12 || >=14"

tests/fixtures/integrations/stylelint-v14.4/src/valid.vue

@@ -1,6 +1,6 @@
 <style>
 a {
-    color: red;
+    color: v-bind(color);
 }
 
 :global(.foo),

tests/fixtures/integrations/stylelint/package.json

@@ -6,8 +6,8 @@
     "devDependencies": {
         "postcss-html": "^1.0.0",
         "stylelint": "^14.5.0",
-        "stylelint-config-recommended-vue": "file:../../../../",
-        "stylelint-config-recommended": "^7.0.0"
+        "stylelint-config-recommended": "^7.0.0",
+        "stylelint-config-recommended-vue": "file:../../../../stylelint-config-recommended-vue-test.tgz"
     },
     "engines": {
         "node": "^12 || >=14"

tests/fixtures/integrations/stylelint/src/valid.vue

@@ -1,6 +1,6 @@
 <style>
 a {
-    color: red;
+    color: v-bind(color);
 }
 
 :global(.foo),