From dc88a48c43d2979184ca31d54e6dc6c6e258708d Mon Sep 17 00:00:00 2001
From: lumburr <flyfish.zy@foxmail.com>
Date: Thu, 28 Apr 2022 17:01:53 +0800
Subject: [PATCH] fix: Allows less overriding of imported css custom
 properties.

---
 packages/less/src/less/tree/ruleset.js        | 31 ++++++++++++++-----
 packages/test-data/css/_main/import.css       | 12 +++++++
 packages/test-data/less/_main/import.less     | 14 +++++++++
 .../less/_main/import/import-style.less       |  7 +++++
 4 files changed, 57 insertions(+), 7 deletions(-)
 create mode 100644 packages/test-data/less/_main/import/import-style.less

diff --git a/packages/less/src/less/tree/ruleset.js b/packages/less/src/less/tree/ruleset.js
index 22f68b75c..08b4dcc65 100644
--- a/packages/less/src/less/tree/ruleset.js
+++ b/packages/less/src/less/tree/ruleset.js
@@ -81,9 +81,9 @@ Ruleset.prototype = Object.assign(new Node(), {
                 }
                 this.parse.parseNode(
                     toParseSelectors.join(','),
-                    ["selectors"], 
-                    selectors[0].getIndex(), 
-                    selectors[0].fileInfo(), 
+                    ["selectors"],
+                    selectors[0].getIndex(),
+                    selectors[0].fileInfo(),
                     function(err, result) {
                         if (result) {
                             selectors = utils.flattenArray(result);
@@ -230,17 +230,34 @@ Ruleset.prototype = Object.assign(new Node(), {
         let i;
         let importRules;
         if (!rules) { return; }
-
+        const importDecl = {};
         for (i = 0; i < rules.length; i++) {
             if (rules[i].type === 'Import') {
                 importRules = rules[i].eval(context);
                 if (importRules && (importRules.length || importRules.length === 0)) {
+                    // fix: #3563
+                    importRules.forEach((node, index) => {
+                        if (node instanceof Declaration) {
+                            if (!importDecl[node.name]) {
+                                importDecl[node.name] = [i + index]
+                            } else {
+                                importDecl[node.name].push(i + index)
+                            }
+                        }
+                    })
                     rules.splice.apply(rules, [i, 1].concat(importRules));
                     i += importRules.length - 1;
                 } else {
                     rules.splice(i, 1, importRules);
                 }
                 this.resetCache();
+            } else if (rules[i] instanceof Declaration && importDecl[rules[i].name]) {
+                const name = rules[i].name
+                importDecl[name].forEach(e => {
+                    if (rules[e].name === name) {
+                        rules[e].value = rules[i].value
+                    }
+                })
             }
         }
     },
@@ -356,9 +373,9 @@ Ruleset.prototype = Object.assign(new Node(), {
                 if (typeof decl.value.value === 'string') {
                     this.parse.parseNode(
                         decl.value.value,
-                        ['value', 'important'], 
-                        decl.value.getIndex(), 
-                        decl.fileInfo(), 
+                        ['value', 'important'],
+                        decl.value.getIndex(),
+                        decl.fileInfo(),
                         function(err, result) {
                             if (err) {
                                 decl.parsed = true;
diff --git a/packages/test-data/css/_main/import.css b/packages/test-data/css/_main/import.css
index 4590222ea..6b69ec78f 100644
--- a/packages/test-data/css/_main/import.css
+++ b/packages/test-data/css/_main/import.css
@@ -47,3 +47,15 @@
     width: 100%;
   }
 }
+.some-class {
+  color: var(--primary-color);
+  backgroundColor: var(--bg-color);
+}
+:root {
+  --primary-color: #fff;
+  --bg-color: #000;
+}
+html[data-theme="dark"] {
+  --primary-color: #000;
+  --bg-color: #fff;
+}
diff --git a/packages/test-data/less/_main/import.less b/packages/test-data/less/_main/import.less
index e7d175692..346eaa19a 100644
--- a/packages/test-data/less/_main/import.less
+++ b/packages/test-data/less/_main/import.less
@@ -30,3 +30,17 @@
 
 @charset "UTF-8"; // climb on top #2126
 
+// #3563
+@import "import/import-style.less";
+@base-color: var(--primary-color);
+@dark-color: var(--bg-color);
+
+:root {
+    --primary-color: #fff;
+    --bg-color: #000;
+}
+
+html[data-theme="dark"] {
+    --primary-color: #000;
+    --bg-color: #fff;
+}
diff --git a/packages/test-data/less/_main/import/import-style.less b/packages/test-data/less/_main/import/import-style.less
new file mode 100644
index 000000000..76e7fa4fa
--- /dev/null
+++ b/packages/test-data/less/_main/import/import-style.less
@@ -0,0 +1,7 @@
+@base-color: green;
+@dark-color: darken(@base-color, 50%);
+
+.some-class {
+  color: @base-color;
+  backgroundColor: @dark-color;
+}