From 967299a1eccb267197c19b76fe1e970e9b6cbbba Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Arnaud=20Barr=C3=A9?= <arnaud.barre@carbometrix.com>
Date: Sun, 13 Nov 2022 05:27:39 +0100
Subject: [PATCH] feat(hmr): deduplicate paths and join them with commas
 (#10891)

---
 packages/vite/src/node/server/hmr.ts              | 5 ++---
 playground/tailwind/src/components/HelloWorld.vue | 3 ++-
 playground/tailwind/src/utils.ts                  | 2 ++
 playground/tailwind/src/views/Page.vue            | 5 ++++-
 4 files changed, 10 insertions(+), 5 deletions(-)
 create mode 100644 playground/tailwind/src/utils.ts

diff --git a/packages/vite/src/node/server/hmr.ts b/packages/vite/src/node/server/hmr.ts
index e5d93fad8629de..64c031223a2df9 100644
--- a/packages/vite/src/node/server/hmr.ts
+++ b/packages/vite/src/node/server/hmr.ts
@@ -181,9 +181,8 @@ export function updateModules(
   }
 
   config.logger.info(
-    updates
-      .map(({ path }) => colors.green(`hmr update `) + colors.dim(path))
-      .join('\n'),
+    colors.green(`hmr update `) +
+      colors.dim([...new Set(updates.map((u) => u.path))].join(', ')),
     { clear: true, timestamp: true }
   )
   ws.send({
diff --git a/playground/tailwind/src/components/HelloWorld.vue b/playground/tailwind/src/components/HelloWorld.vue
index 1ea9fdf2573697..b1ce4248557b39 100644
--- a/playground/tailwind/src/components/HelloWorld.vue
+++ b/playground/tailwind/src/components/HelloWorld.vue
@@ -5,5 +5,6 @@
 </template>
 
 <script setup lang="ts">
-const count = 1
+import { INITIAL_COUNT } from '../utils.ts'
+const count = INITIAL_COUNT
 </script>
diff --git a/playground/tailwind/src/utils.ts b/playground/tailwind/src/utils.ts
new file mode 100644
index 00000000000000..38c21ae7a0f8d8
--- /dev/null
+++ b/playground/tailwind/src/utils.ts
@@ -0,0 +1,2 @@
+export const NAME = 'Tailwind'
+export const INITIAL_COUNT = 1
diff --git a/playground/tailwind/src/views/Page.vue b/playground/tailwind/src/views/Page.vue
index 84d4af06bb1c18..12fc2605339f1d 100644
--- a/playground/tailwind/src/views/Page.vue
+++ b/playground/tailwind/src/views/Page.vue
@@ -5,7 +5,7 @@
     <div
       class="tailwind-style bg-red-100 inline-block h-24 px-8 mb-8 text-[#888888]"
     >
-      Tailwind style
+      {{ name }} style
     </div>
     <HelloWorld />
     <PugTemplate />
@@ -16,13 +16,16 @@
 import { defineComponent, ref } from 'vue'
 import HelloWorld from '../components/HelloWorld.vue'
 import PugTemplate from '../components/PugTemplate.vue'
+import { NAME } from '../utils.ts'
 
 export default defineComponent({
   components: { HelloWorld, PugTemplate },
   setup() {
+    const name = NAME
     const val = ref(0)
 
     return {
+      name,
       val
     }
   }