Merge pull request #1487 from cwyyue/fix-unocss-feature-cwy

Fix unocss feature cwy
didi · May 31, 2024 · fbeae19 · fbeae19
2 parents 96cc332 + f409dc8
commit fbeae19
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 12 deletions.
diff --git a/packages/unocss-base/lib/index.js b/packages/unocss-base/lib/index.js
@@ -11,7 +11,7 @@ module.exports = function presetMpx (options = {}) {
     name: '@mpxjs/unocss-base',
     theme: {
       ...uno.theme,
-      preflightRoot: 'page'
+      preflightRoot: ['page,view,text,div,span,::before,::after,::backdrop']
     },
     postprocess: (util) => {
       util.entries.forEach((i) => {

diff --git a/packages/unocss-plugin/lib/index.js b/packages/unocss-plugin/lib/index.js
@@ -86,16 +86,18 @@ function normalizeOptions (options) {
     config,
     configFiles,
     transformCSS,
-    transformGroups,
+    transformGroups, // false | true | { separators: [':','-'] }
     webOptions = {}
   } = options
+  // 是否兼容为true的写法
+  if (transformGroups) transformGroups = transformGroups instanceof Object ? transformGroups : {}
   // web配置
   // todo config读取逻辑通过UnoCSSWebpackPlugin内置逻辑进行，待改进
   webOptions = {
     include: scan.include || [],
     exclude: scan.exclude || [],
     transformers: [
-      ...transformGroups ? [transformerVariantGroup()] : [],
+      ...transformGroups ? [transformerVariantGroup(transformGroups)] : [],
       ...transformCSS ? [transformerDirectives()] : []
     ],
     ...webOptions
@@ -321,7 +323,7 @@ class MpxUnocssPlugin {
           // pre process
           source = transformAlias(source)
           if (this.options.transformGroups) {
-            source = transformGroups(source)
+            source = transformGroups(source, this.options.transformGroups)
           }
           const content = source.source()
           // escape & fill classesMap

diff --git a/packages/unocss-plugin/lib/transform.js b/packages/unocss-plugin/lib/transform.js
@@ -38,20 +38,24 @@ function buildAliasTransformer (alias) {
     return source
   }
 }
+const regexCache = {}
+function makeRegexClassGroup (separators = ['-', ':']) {
+  const key = separators.join('|')
+  if (!regexCache[key]) regexCache[key] = new RegExp(`((?:[!@<~\\w+:_/-]|\\[&?>?:?\\S*\\])+?)(${key})\\(((?:[~!<>\\w\\s:/\\\\,%#.$?-]|\\[.*?\\])+?)\\)(?!\\s*?=>)`, 'gm')
+  regexCache[key].lastIndex = 0
+  return regexCache[key]
+}
 
-const groupReg = /([!\w+-<@][\w+:_/-]*?\w):\(((?:[!\w\s:/\\,%#.$-]|\[.*?\])*?)\)/gm
-
-function transformGroups (source) {
+function transformGroups (source, options = {}) {
   source = getReplaceSource(source)
   const content = source.original().source()
   let match
-  groupReg.lastIndex = 0
+  const groupReg = makeRegexClassGroup(options.separators)
   while (match = groupReg.exec(content)) {
     const start = match.index
-    const end = start + match[0].length - 1
-    const a = match[1]
-    const b = match[2]
-    const replacement = b.split(/\s+/g).filter(Boolean).map(i => i.replace(/^(!?)(.*)/, `$1${a}:$2`)).join(' ')
+    const [text, a, spread, b] = match
+    const end = start + text.length - 1
+    const replacement = b.split(/\s+/g).filter(Boolean).map(i => i.replace(/^(!?)(.*)/, `$1${a}${spread}$2`)).join(' ')
     source.replace(start, end, replacement)
   }
   return source