fix(webpack): only load necessary modules

packages/transformer-directives/src/index.ts

@@ -3,7 +3,6 @@ import type { SourceCodeTransformer, StringifiedUtil, UnoGenerator } from '@unoc
 import type { Atrule, CssNode, Declaration, List, ListItem, Rule, Selector, SelectorList } from 'css-tree'
 import { clone, generate, parse, walk } from 'css-tree'
 import type MagicString from 'magic-string'
-import { calcMaxWidthBySize } from '@unocss/preset-mini/variants'
 import type { Theme } from '@unocss/preset-mini'
 
 type Writeable<T> = { -readonly [P in keyof T]: T[P] }
@@ -272,3 +271,10 @@ export async function transformDirectives(
 
   await Promise.all(stack)
 }
+
+function calcMaxWidthBySize(size: string) {
+  const value = size.match(/^-?[0-9]+\.?[0-9]*/)?.[0] || ''
+  const unit = size.slice(value.length)
+  const maxWidth = (parseFloat(value) - 0.1)
+  return Number.isNaN(maxWidth) ? size : `${maxWidth}${unit}`
+}

packages/webpack/package.json

@@ -45,7 +45,7 @@
     "@unocss/config": "workspace:*",
     "@unocss/core": "workspace:*",
     "magic-string": "^0.26.2",
-    "unplugin": "^0.9.3",
+    "unplugin": "^0.9.4",
     "webpack-sources": "^3.2.3"
   },
   "devDependencies": {

packages/webpack/src/index.ts

@@ -75,14 +75,13 @@ export default function WebpackPlugin<Theme extends {}>(
           return entry + query
         }
       },
+      loadInclude(id) {
+        const layer = getLayer(id)
+        return !!layer
+      },
       // serve the placeholders in virtual module
       load(id) {
-        let layer = resolveLayer(getPath(id))
-        if (!layer) {
-          const entry = resolveId(id)
-          if (entry)
-            layer = resolveLayer(entry)
-        }
+        const layer = getLayer(id)
         const hash = hashes.get(id)
         if (layer)
           return (hash ? getHashPlaceholder(hash) : '') + getLayerPlaceholder(layer)
@@ -160,3 +159,13 @@ export default function WebpackPlugin<Theme extends {}>(
     return plugin
   }).webpack()
 }
+function getLayer(id: string) {
+  let layer = resolveLayer(getPath(id))
+  if (!layer) {
+    const entry = resolveId(id)
+    if (entry)
+      layer = resolveLayer(entry)
+  }
+  return layer
+}
+