fix(webpack): webpack4 optimize filter *

unocss · Aug 17, 2022 · bf990fc · bf990fc
1 parent 9ff2f7f
commit bf990fc
Show file tree

Hide file tree

Showing 12 changed files with 110 additions and 0 deletions.
diff --git a/examples/webpack4/.npmrc b/examples/webpack4/.npmrc
@@ -0,0 +1 @@
+shamefully-hoist=true
diff --git a/examples/webpack4/babel.config.js b/examples/webpack4/babel.config.js
@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
+}
diff --git a/examples/webpack4/package.json b/examples/webpack4/package.json
@@ -0,0 +1,17 @@
+{
+  "private": true,
+  "scripts": {
+    "dev": "vue-cli-service serve",
+    "build": "vue-cli-service build"
+  },
+  "dependencies": {
+    "vue": "^2.6.11"
+  },
+  "devDependencies": {
+    "@unocss/webpack": "link:../../packages/webpack",
+    "@vue/cli-plugin-babel": "~4.5.15",
+    "@vue/cli-service": "~4.5.15",
+    "unocss": "^0.45.6",
+    "vue-template-compiler": "^2.6.11"
+  }
+}
diff --git a/examples/webpack4/pnpm-workspace.yaml b/examples/webpack4/pnpm-workspace.yaml
diff --git a/examples/webpack4/public/index.html b/examples/webpack4/public/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <title>webpack4 demo</title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+  </body>
+</html>
diff --git a/examples/webpack4/src/About.vue b/examples/webpack4/src/About.vue
@@ -0,0 +1,5 @@
+<template>
+  <div class="about w-166px bg-green">
+    <h1>About</h1>
+  </div>
+</template>
diff --git a/examples/webpack4/src/App.vue b/examples/webpack4/src/App.vue
@@ -0,0 +1,19 @@
+<template>
+  <div flex id="app"  class="w-77px">
+    <About />
+    <Home />
+  </div>
+</template>
+<script>
+import About from './About.vue'
+import Home from './Home.vue'
+export default {
+  components: {
+    About,
+    Home
+  }
+}
+</script>
+<style>
+
+</style>
diff --git a/examples/webpack4/src/Home.vue b/examples/webpack4/src/Home.vue
@@ -0,0 +1,14 @@
+<template>
+  <div class="home">
+    <div class="w-200px bg-red h-100px">HOME</div>
+  </div>
+</template>
+
+<script>
+// @ is an alias to /src
+
+export default {
+  name: 'Home',
+  
+}
+</script>
diff --git a/examples/webpack4/src/main.js b/examples/webpack4/src/main.js
@@ -0,0 +1,8 @@
+import Vue from 'vue'
+import App from './App.vue'
+
+import 'uno.css'
+
+new Vue({
+  render: h => h(App)
+}).$mount('#app')
diff --git a/examples/webpack4/unocss.config.js b/examples/webpack4/unocss.config.js
@@ -0,0 +1,9 @@
+import presetAttributify from '@unocss/preset-attributify'
+import presetUno from '@unocss/preset-uno'
+
+module.exports =  {
+  presets: [
+    presetAttributify(),
+    presetUno(),
+  ]
+}
diff --git a/examples/webpack4/vue.config.js b/examples/webpack4/vue.config.js
@@ -0,0 +1,16 @@
+const UnoCSS = require('@unocss/webpack').default
+
+module.exports = {
+  configureWebpack: {
+    plugins: [
+      UnoCSS({}),
+    ],
+  },
+  chainWebpack(config) {
+    config.module.rule('vue').uses.delete('cache-loader')
+    config.module.rule('tsx').uses.delete('cache-loader')
+    config.merge({
+      cache: false,
+    })
+  },
+}
diff --git a/packages/webpack/src/index.ts b/packages/webpack/src/index.ts
@@ -97,6 +97,7 @@ export default function WebpackPlugin<Theme extends {}>(
             const result = await uno.generate(tokens, { minify: true })
 
             for (const file of files) {
+              if (file === '*') return;
               let code = compilation.assets[file].source().toString()
               let replaced = false
               code = code.replace(HASH_PLACEHOLDER_RE, '')