增加:deep()的支持

lib/compile-vue.js

@@ -16,7 +16,8 @@ import {
   STYLE_EXP,
   HTML_EXP,
   CSS_SHEET_EXP,
-  HMR_SCRIPT
+  HMR_SCRIPT,
+  V_DEEP
 } from './constants.js'
 
 const OPTIONS = {
@@ -45,7 +46,18 @@ function scopeCss(css = '', hash) {
           let tmp = s.split(' ')
           let last = tmp.pop()
           if (last.includes(':')) {
-            last = last.replace(':', `[data-${hash}]:`)
+            let res = V_DEEP.exec(last)
+            if (res) {
+              last = tmp.pop()
+              last += `[data-${hash}] ` + res[1]
+            } else {
+              if (last.startsWith(':')) {
+                let _prev = tmp.pop()
+                last = `${_prev}[data-${hash}] ` + last
+              } else {
+                last = last.replace(':', `[data-${hash}]:`)
+              }
+            }
           } else {
             last += `[data-${hash}]`
           }

lib/constants.js

@@ -7,6 +7,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]*?)\n<\/template>/
+export const V_DEEP = /:deep\(([^)]*?)\)/
 
 export const CSS_SHEET_EXP = /([@\w\.,#\-:>\+\~\|\(\)\[\]"'\=\s]+)\{/g
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "fite",
   "type": "module",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "bin": {
     "fite": "index.js"
   },