From cc348dccc4bb85370ed37c99edd4e8643b7219cd Mon Sep 17 00:00:00 2001
From: yutent <yutent.io@gmail.com>
Date: Mon, 20 Feb 2023 00:41:58 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=A0=B7=E5=BC=8Fscoped?=
 =?UTF-8?q?=E7=9A=84=E5=AE=9E=E7=8E=B0;=20=E4=BC=98=E5=8C=96HMR=E6=81=A2?=
 =?UTF-8?q?=E5=A4=8D=E6=97=B6=E5=88=B7=E6=96=B0=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lib/compile-vue.js | 17 ++++++-----------
 lib/constants.js   |  8 ++++++--
 package.json       |  2 +-
 3 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/lib/compile-vue.js b/lib/compile-vue.js
index b1a5f08..aca6ecb 100644
--- a/lib/compile-vue.js
+++ b/lib/compile-vue.js
@@ -30,12 +30,8 @@ function md5(str = '') {
 }
 
 function scopeCss(css = '', hash) {
-  let rules = css.matchAll(CSS_SHEET_EXP)
-
-  return [...rules]
-    .map(r => {
-      let selector = r[1]
-      let style = r[2]
+  return css.replace(CSS_SHEET_EXP, (m, selector) => {
+    if (!selector.startsWith('@')) {
       selector = selector.split(',')
 
       selector = selector
@@ -51,10 +47,9 @@ function scopeCss(css = '', hash) {
           return tmp.join(' ')
         })
         .join(', ')
-
-      return selector + ` {${style}}`
-    })
-    .join('\n')
+    }
+    return selector + '{'
+  })
 }
 
 /**
@@ -224,7 +219,7 @@ export function compileVue(file, imports, options = {}, isBuild) {
       let scoped = it[0].includes('scoped')
       let css = compileScss(it[1])
       if (scoped) {
-        return scopeCss(css, hash)
+        css = scopeCss(css, hash)
       }
       return css
     })
diff --git a/lib/constants.js b/lib/constants.js
index 013bf77..5cc139b 100644
--- a/lib/constants.js
+++ b/lib/constants.js
@@ -8,8 +8,7 @@ export const JS_EXP = /<script[^>]*?>([\w\W]*?)<\/script>/
 export const STYLE_EXP = /<style[^>]*?>([\w\W]*?)<\/style>/g
 export const HTML_EXP = /<template[^>]*?>([\w\W]*?)<\/template>/
 
-export const CSS_SHEET_EXP =
-  /([\w\.,#\-:>\+\~\|\(\)\[\]"'\=\s]+)\{([^\{\}]*?)\}/g
+export const CSS_SHEET_EXP = /([@\w\.,#\-:>\+\~\|\(\)\[\]"'\=\s]+)\{/g
 
 export const COMMON_HEADERS = {
   'Cache-Control': 'no-store'
@@ -20,10 +19,15 @@ export const HMR_SCRIPT = `
   var ws = new WebSocket(\`ws\${location.protocol === 'https:' ? 's' : ''}://\${location.host}/ws-vue-live\`)
 
   ws.addEventListener('open', function (r) {
+    if(vue_live_hmr.closed){
+      delete vue_live_hmr.closed
+      location.reload()
+    }
     console.log('vue-live hmr ready...')
   })
 
   ws.addEventListener('close', function(){
+    vue_live_hmr.closed = true
     setTimeout(vue_live_hmr, 2000)
   })
   
diff --git a/package.json b/package.json
index c56b2e4..7590c57 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@bytedo/vue-live",
   "type": "module",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "bin": {
     "vue-live": "index.js"
   },