From 51fb0994eddad4bd4c0d687fce4b2c24ae03ac7d Mon Sep 17 00:00:00 2001
From: WangXinhai <18907191365@189.cn>
Date: Sun, 1 Apr 2018 00:59:19 +0800
Subject: [PATCH 1/7] theme replacing should cut tons of irrelevant css
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

风格替换既然是颜色,那么应该削减大量无关的代码. 可以通过regexp
捕捉相关的,以上代码经过测试
---
 src/components/ThemePicker/index.vue | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/components/ThemePicker/index.vue b/src/components/ThemePicker/index.vue
index b366d963fa0..a5e7059a0c1 100644
--- a/src/components/ThemePicker/index.vue
+++ b/src/components/ThemePicker/index.vue
@@ -65,12 +65,18 @@ export default {
   },
 
   methods: {
-    updateStyle(style, oldCluster, newCluster) {
-      let newStyle = style
+    updateStyle(style, oldCluster, newCluster) {      
+      let colorOverrides = [] // only capture color overides
       oldCluster.forEach((color, index) => {
-        newStyle = newStyle.replace(new RegExp(color, 'ig'), newCluster[index])
+        let value = newCluster[index]
+        let repl = new RegExp(`(^|})([^{]+{[^{}]+)${color}\\b([^}]*)(?=})`, 'gi')
+        let nestRepl = new RegExp(color, 'ig') // for greed matching before the 'color'
+        let v
+        while ((v = repl.exec(data))) {
+          colorOverrides.push(v[2].replace(nestRepl, value) + value + v[3] + '}') // '}' not captured in the regexp repl to reserve it as locator-boundary
+        }
       })
-      return newStyle
+      return colorOverrides.join('')
     },
 
     getCSSString(url, callback, variable) {

From d079d126b67541ab5d516562cb4f1463fdf35963 Mon Sep 17 00:00:00 2001
From: WangXinhai <18907191365@189.cn>
Date: Sun, 1 Apr 2018 01:04:24 +0800
Subject: [PATCH 2/7] Update index.vue

---
 src/components/ThemePicker/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ThemePicker/index.vue b/src/components/ThemePicker/index.vue
index a5e7059a0c1..ea615e86e12 100644
--- a/src/components/ThemePicker/index.vue
+++ b/src/components/ThemePicker/index.vue
@@ -65,7 +65,7 @@ export default {
   },
 
   methods: {
-    updateStyle(style, oldCluster, newCluster) {      
+    updateStyle(style, oldCluster, newCluster) {
       let colorOverrides = [] // only capture color overides
       oldCluster.forEach((color, index) => {
         let value = newCluster[index]

From 0d21a7be8dead91e98986bc28da4f18c6a0dd4f3 Mon Sep 17 00:00:00 2001
From: WangXinhai <18907191365@189.cn>
Date: Sun, 1 Apr 2018 14:30:19 +0800
Subject: [PATCH 3/7] fix

---
 src/components/ThemePicker/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ThemePicker/index.vue b/src/components/ThemePicker/index.vue
index ea615e86e12..052f6319424 100644
--- a/src/components/ThemePicker/index.vue
+++ b/src/components/ThemePicker/index.vue
@@ -72,7 +72,7 @@ export default {
         let repl = new RegExp(`(^|})([^{]+{[^{}]+)${color}\\b([^}]*)(?=})`, 'gi')
         let nestRepl = new RegExp(color, 'ig') // for greed matching before the 'color'
         let v
-        while ((v = repl.exec(data))) {
+        while ((v = repl.exec(style))) {
           colorOverrides.push(v[2].replace(nestRepl, value) + value + v[3] + '}') // '}' not captured in the regexp repl to reserve it as locator-boundary
         }
       })

From 2ea0f80a2d26dfbe620afc25221b97ffccb4f62e Mon Sep 17 00:00:00 2001
From: WangXinhai <18907191365@189.cn>
Date: Sun, 1 Apr 2018 14:35:33 +0800
Subject: [PATCH 4/7] let - const

---
 src/components/ThemePicker/index.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/ThemePicker/index.vue b/src/components/ThemePicker/index.vue
index 052f6319424..25292e4a9cf 100644
--- a/src/components/ThemePicker/index.vue
+++ b/src/components/ThemePicker/index.vue
@@ -66,11 +66,11 @@ export default {
 
   methods: {
     updateStyle(style, oldCluster, newCluster) {
-      let colorOverrides = [] // only capture color overides
+      const colorOverrides = [] // only capture color overides
       oldCluster.forEach((color, index) => {
-        let value = newCluster[index]
-        let repl = new RegExp(`(^|})([^{]+{[^{}]+)${color}\\b([^}]*)(?=})`, 'gi')
-        let nestRepl = new RegExp(color, 'ig') // for greed matching before the 'color'
+        const value = newCluster[index]
+        const repl = new RegExp(`(^|})([^{]+{[^{}]+)${color}\\b([^}]*)(?=})`, 'gi')
+        const nestRepl = new RegExp(color, 'ig') // for greed matching before the 'color'
         let v
         while ((v = repl.exec(style))) {
           colorOverrides.push(v[2].replace(nestRepl, value) + value + v[3] + '}') // '}' not captured in the regexp repl to reserve it as locator-boundary

From 385c021651b72478700d9919434657116574c7ea Mon Sep 17 00:00:00 2001
From: WangXinhai <18907191365@189.cn>
Date: Sun, 1 Apr 2018 15:45:55 +0800
Subject: [PATCH 5/7] fix

---
 src/components/ThemePicker/index.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/ThemePicker/index.vue b/src/components/ThemePicker/index.vue
index 25292e4a9cf..ded413981fc 100644
--- a/src/components/ThemePicker/index.vue
+++ b/src/components/ThemePicker/index.vue
@@ -69,7 +69,8 @@ export default {
       const colorOverrides = [] // only capture color overides
       oldCluster.forEach((color, index) => {
         const value = newCluster[index]
-        const repl = new RegExp(`(^|})([^{]+{[^{}]+)${color}\\b([^}]*)(?=})`, 'gi')
+        const color_plain = color.replace(/([()])/g,'\\$1')
+        const repl = new RegExp(`(^|})([^{]+{[^{}]+)${color_plain}\\b([^}]*)(?=})`, 'gi')
         const nestRepl = new RegExp(color, 'ig') // for greed matching before the 'color'
         let v
         while ((v = repl.exec(style))) {

From 88cdc0080374bc60cc232d11200efed6f8dd7dfa Mon Sep 17 00:00:00 2001
From: WangXinhai <18907191365@189.cn>
Date: Sun, 1 Apr 2018 15:47:34 +0800
Subject: [PATCH 6/7] reserve color as string

---
 src/components/ThemePicker/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ThemePicker/index.vue b/src/components/ThemePicker/index.vue
index ded413981fc..7ec4af068a9 100644
--- a/src/components/ThemePicker/index.vue
+++ b/src/components/ThemePicker/index.vue
@@ -71,7 +71,7 @@ export default {
         const value = newCluster[index]
         const color_plain = color.replace(/([()])/g,'\\$1')
         const repl = new RegExp(`(^|})([^{]+{[^{}]+)${color_plain}\\b([^}]*)(?=})`, 'gi')
-        const nestRepl = new RegExp(color, 'ig') // for greed matching before the 'color'
+        const nestRepl = new RegExp(color_plain, 'ig') // for greed matching before the 'color'
         let v
         while ((v = repl.exec(style))) {
           colorOverrides.push(v[2].replace(nestRepl, value) + value + v[3] + '}') // '}' not captured in the regexp repl to reserve it as locator-boundary

From 562995dbd78d4bf4ea00bde976b8796219fa447d Mon Sep 17 00:00:00 2001
From: WangXinhai <18907191365@189.cn>
Date: Sun, 1 Apr 2018 15:51:06 +0800
Subject: [PATCH 7/7] eslint fix againt

---
 src/components/ThemePicker/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ThemePicker/index.vue b/src/components/ThemePicker/index.vue
index 7ec4af068a9..b8eacc011ff 100644
--- a/src/components/ThemePicker/index.vue
+++ b/src/components/ThemePicker/index.vue
@@ -69,7 +69,7 @@ export default {
       const colorOverrides = [] // only capture color overides
       oldCluster.forEach((color, index) => {
         const value = newCluster[index]
-        const color_plain = color.replace(/([()])/g,'\\$1')
+        const color_plain = color.replace(/([()])/g, '\\$1')
         const repl = new RegExp(`(^|})([^{]+{[^{}]+)${color_plain}\\b([^}]*)(?=})`, 'gi')
         const nestRepl = new RegExp(color_plain, 'ig') // for greed matching before the 'color'
         let v