From 46252f4c44564a65c25c9e5ec2b28d0a4afbad9e Mon Sep 17 00:00:00 2001 From: arlo Date: Fri, 9 May 2025 08:11:32 +0800 Subject: [PATCH 1/5] feat: add playground --- package.json | 1 + .../playground/reactivity-tracing/index.html | 14 ++++++ .../reactivity-tracing/package.json | 26 +++++++++++ .../reactivity-tracing/public/vite.svg | 1 + .../playground/reactivity-tracing/src/App.vue | 15 +++++++ .../src/components/Number.vue | 9 ++++ .../playground/reactivity-tracing/src/main.ts | 10 +++++ .../reactivity-tracing/src/style.css | 16 +++++++ .../reactivity-tracing/uno.config.ts | 20 +++++++++ .../reactivity-tracing/vite.config.ts | 32 ++++++++++++++ pnpm-lock.yaml | 43 +++++++++++++++++++ 11 files changed, 187 insertions(+) create mode 100644 packages/playground/reactivity-tracing/index.html create mode 100644 packages/playground/reactivity-tracing/package.json create mode 100644 packages/playground/reactivity-tracing/public/vite.svg create mode 100644 packages/playground/reactivity-tracing/src/App.vue create mode 100644 packages/playground/reactivity-tracing/src/components/Number.vue create mode 100644 packages/playground/reactivity-tracing/src/main.ts create mode 100644 packages/playground/reactivity-tracing/src/style.css create mode 100644 packages/playground/reactivity-tracing/uno.config.ts create mode 100644 packages/playground/reactivity-tracing/vite.config.ts diff --git a/package.json b/package.json index d1f492feb..5d52a8475 100644 --- a/package.json +++ b/package.json @@ -66,6 +66,7 @@ "play:webpack": "turbo dev --filter=./packages/playground/webpack", "play:options-api": "turbo dev --filter=./packages/playground/options-api", "play:plugin-sfc": "turbo dev --filter=./packages/playground/plugin-sfc", + "play:reactivity-tracing": "turbo dev --filter=./packages/playground/reactivity-tracing", "docs": "pnpm -C docs run docs:dev", "docs:build": "pnpm -C docs run docs:build", "zip": "tsx ./scripts/extension-zip.ts", diff --git a/packages/playground/reactivity-tracing/index.html b/packages/playground/reactivity-tracing/index.html new file mode 100644 index 000000000..7e85ca8b3 --- /dev/null +++ b/packages/playground/reactivity-tracing/index.html @@ -0,0 +1,14 @@ + + + + + + + Vue DevTools Basic Playground + + +
+
+ + + diff --git a/packages/playground/reactivity-tracing/package.json b/packages/playground/reactivity-tracing/package.json new file mode 100644 index 000000000..6f5dc6982 --- /dev/null +++ b/packages/playground/reactivity-tracing/package.json @@ -0,0 +1,26 @@ +{ + "name": "playground-reactivity-tracing", + "type": "module", + "version": "7.3.2", + "private": true, + "scripts": { + "dev": "vite" + }, + "dependencies": { + "@vueuse/core": "catalog:", + "pinia": "catalog:", + "unplugin-auto-import": "catalog:", + "vue": "catalog:", + "vue-router": "catalog:" + }, + "devDependencies": { + "@vitejs/plugin-vue": "catalog:", + "sass-embedded": "catalog:", + "serve": "catalog:", + "typescript": "catalog:", + "unocss": "catalog:", + "vite": "catalog:", + "vite-plugin-inspect": "catalog:", + "vite-plugin-vue-devtools": "workspace:*" + } +} diff --git a/packages/playground/reactivity-tracing/public/vite.svg b/packages/playground/reactivity-tracing/public/vite.svg new file mode 100644 index 000000000..e7b8dfb1b --- /dev/null +++ b/packages/playground/reactivity-tracing/public/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/playground/reactivity-tracing/src/App.vue b/packages/playground/reactivity-tracing/src/App.vue new file mode 100644 index 000000000..d07a55fff --- /dev/null +++ b/packages/playground/reactivity-tracing/src/App.vue @@ -0,0 +1,15 @@ + + + diff --git a/packages/playground/reactivity-tracing/src/components/Number.vue b/packages/playground/reactivity-tracing/src/components/Number.vue new file mode 100644 index 000000000..2b1ddedef --- /dev/null +++ b/packages/playground/reactivity-tracing/src/components/Number.vue @@ -0,0 +1,9 @@ + + + diff --git a/packages/playground/reactivity-tracing/src/main.ts b/packages/playground/reactivity-tracing/src/main.ts new file mode 100644 index 000000000..2ee8bc91a --- /dev/null +++ b/packages/playground/reactivity-tracing/src/main.ts @@ -0,0 +1,10 @@ +import { createApp } from 'vue' + +import App from './App.vue' + +import './style.css' +import 'uno.css' + +const app = createApp(App) + +app.mount('#app') diff --git a/packages/playground/reactivity-tracing/src/style.css b/packages/playground/reactivity-tracing/src/style.css new file mode 100644 index 000000000..f0a3c1807 --- /dev/null +++ b/packages/playground/reactivity-tracing/src/style.css @@ -0,0 +1,16 @@ +:root { + font-family: Inter, Avenir, Helvetica, Arial, sans-serif; + font-size: 16px; + line-height: 24px; + font-weight: 400; + + color-scheme: light dark; + color: rgba(255, 255, 255, 0.87); + background-color: #242424; + + font-synthesis: none; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + -webkit-text-size-adjust: 100%; +} diff --git a/packages/playground/reactivity-tracing/uno.config.ts b/packages/playground/reactivity-tracing/uno.config.ts new file mode 100644 index 000000000..b1d9fa578 --- /dev/null +++ b/packages/playground/reactivity-tracing/uno.config.ts @@ -0,0 +1,20 @@ +import { + defineConfig, + presetAttributify, + presetTypography, + presetUno, + transformerDirectives, + transformerVariantGroup, +} from 'unocss' + +export default defineConfig({ + presets: [ + presetUno(), + presetAttributify(), + presetTypography(), + ], + transformers: [ + transformerDirectives(), + transformerVariantGroup(), + ], +}) diff --git a/packages/playground/reactivity-tracing/vite.config.ts b/packages/playground/reactivity-tracing/vite.config.ts new file mode 100644 index 000000000..eb96af140 --- /dev/null +++ b/packages/playground/reactivity-tracing/vite.config.ts @@ -0,0 +1,32 @@ +import vue from '@vitejs/plugin-vue' +import Unocss from 'unocss/vite' + +import AutoImport from 'unplugin-auto-import/vite' +import { defineConfig } from 'vite' +import VueDevtools from 'vite-plugin-vue-devtools' + +// https://vitejs.dev/config/ +export default defineConfig({ + css: { + preprocessorOptions: { + scss: { + api: 'modern-compiler', + }, + }, + }, + plugins: [ + vue(), + VueDevtools(), + Unocss(), + AutoImport({ + imports: [ + 'vue', + 'vue-router', + '@vueuse/core', + ], + }), + ], + server: { + port: 3001, + }, +}) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index bafe1246e..34f7ae967 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -817,6 +817,49 @@ importers: specifier: workspace:* version: link:../../vite + packages/playground/reactivity-tracing: + dependencies: + '@vueuse/core': + specifier: 'catalog:' + version: 12.8.2(typescript@5.8.2) + pinia: + specifier: 'catalog:' + version: 3.0.1(typescript@5.8.2)(vue@3.5.13(typescript@5.8.2)) + unplugin-auto-import: + specifier: 'catalog:' + version: 19.1.2(@vueuse/core@12.8.2(typescript@5.8.2)) + vue: + specifier: 'catalog:' + version: 3.5.13(typescript@5.8.2) + vue-router: + specifier: 'catalog:' + version: 4.5.0(vue@3.5.13(typescript@5.8.2)) + devDependencies: + '@vitejs/plugin-vue': + specifier: 'catalog:' + version: 5.2.3(vite@6.2.1(@types/node@22.13.14)(jiti@2.4.2)(sass-embedded@1.86.0)(terser@5.37.0)(tsx@4.19.3)(yaml@2.7.0))(vue@3.5.13(typescript@5.8.2)) + sass-embedded: + specifier: 'catalog:' + version: 1.86.0 + serve: + specifier: 'catalog:' + version: 14.2.4 + typescript: + specifier: 'catalog:' + version: 5.8.2 + unocss: + specifier: 'catalog:' + version: 66.0.0(postcss@8.5.3)(vite@6.2.1(@types/node@22.13.14)(jiti@2.4.2)(sass-embedded@1.86.0)(terser@5.37.0)(tsx@4.19.3)(yaml@2.7.0))(vue@3.5.13(typescript@5.8.2)) + vite: + specifier: 'catalog:' + version: 6.2.1(@types/node@22.13.14)(jiti@2.4.2)(sass-embedded@1.86.0)(terser@5.37.0)(tsx@4.19.3)(yaml@2.7.0) + vite-plugin-inspect: + specifier: 'catalog:' + version: 0.8.9(rollup@4.39.0)(vite@6.2.1(@types/node@22.13.14)(jiti@2.4.2)(sass-embedded@1.86.0)(terser@5.37.0)(tsx@4.19.3)(yaml@2.7.0)) + vite-plugin-vue-devtools: + specifier: workspace:* + version: link:../../vite + packages/playground/ui: dependencies: '@unocss/reset': From 3c015a3c57eb4469f1a06ecf8eae2812241407cc Mon Sep 17 00:00:00 2001 From: arlo Date: Sat, 17 May 2025 16:50:55 +0800 Subject: [PATCH 2/5] chore: update playground --- .../reactivity-tracing/package.json | 2 +- .../playground/reactivity-tracing/src/App.vue | 11 +- pnpm-lock.yaml | 230 +++++++++++++++++- 3 files changed, 235 insertions(+), 8 deletions(-) diff --git a/packages/playground/reactivity-tracing/package.json b/packages/playground/reactivity-tracing/package.json index 6f5dc6982..2f9981803 100644 --- a/packages/playground/reactivity-tracing/package.json +++ b/packages/playground/reactivity-tracing/package.json @@ -10,7 +10,7 @@ "@vueuse/core": "catalog:", "pinia": "catalog:", "unplugin-auto-import": "catalog:", - "vue": "catalog:", + "vue": "https://pkg.pr.new/vue@13274", "vue-router": "catalog:" }, "devDependencies": { diff --git a/packages/playground/reactivity-tracing/src/App.vue b/packages/playground/reactivity-tracing/src/App.vue index d07a55fff..0bbe3dada 100644 --- a/packages/playground/reactivity-tracing/src/App.vue +++ b/packages/playground/reactivity-tracing/src/App.vue @@ -1,13 +1,22 @@