@icebreakers/monorepo 3.0.1 → 3.0.3

package/assets/package.json

@@ -3,7 +3,7 @@
   "type": "module",
   "version": "0.0.0",
   "private": true,
-  "packageManager": "pnpm@10.23.0",
+  "packageManager": "pnpm@10.24.0",
   "author": "ice breaker <1324318532@qq.com>",
   "repository": {
     "type": "git",
@@ -40,17 +40,17 @@
     "script:mirror": "monorepo mirror"
   },
   "devDependencies": {
-    "@changesets/changelog-github": "^0.5.1",
-    "@changesets/cli": "^2.29.7",
+    "@changesets/changelog-github": "^0.5.2",
+    "@changesets/cli": "^2.29.8",
     "@commitlint/cli": "^20.1.0",
     "@icebreakers/commitlint-config": "^1.2.2",
-    "@icebreakers/eslint-config": "^1.5.9",
+    "@icebreakers/eslint-config": "^1.6.0",
     "@icebreakers/monorepo": "workspace:*",
     "@icebreakers/stylelint-config": "^1.2.3",
     "@types/fs-extra": "^11.0.4",
     "@types/node": "^24.10.1",
     "@types/semver": "^7.7.1",
-    "@vitest/coverage-v8": "~4.0.12",
+    "@vitest/coverage-v8": "~4.0.14",
     "ci-info": "^4.3.1",
     "cross-env": "^10.1.0",
     "defu": "^6.1.4",
@@ -64,8 +64,8 @@
     "pathe": "^2.0.3",
     "pkg-types": "^2.3.0",
     "rimraf": "^6.1.2",
-    "stylelint": "^16.25.0",
-    "tsdown": "^0.16.6",
+    "stylelint": "^16.26.1",
+    "tsdown": "^0.16.8",
     "tslib": "^2.8.1",
     "tsup": "^8.5.1",
     "tsx": "^4.20.6",
@@ -73,7 +73,7 @@
     "type-fest": "^5.2.0",
     "typescript": "^5.9.3",
     "unbuild": "^3.6.1",
-    "vitest": "~4.0.12",
+    "vitest": "~4.0.14",
     "yaml": "^2.8.1"
   },
   "publishConfig": {

package/dist/cli.cjs

@@ -1,4 +1,4 @@
-const require_upgrade = require('./upgrade-C7eRZs41.cjs');
+const require_upgrade = require('./upgrade-BTMNNTgu.cjs');
 let node_process = require("node:process");
 node_process = require_upgrade.__toESM(node_process);
 let __inquirer_input = require("@inquirer/input");

package/dist/cli.mjs

@@ -1,4 +1,4 @@
-import { E as cleanProjects, T as version, c as getCreateChoices, i as init, k as resolveCommandConfig, n as syncNpmMirror, o as createNewProject, r as setVscodeBinaryMirror, s as defaultTemplate, t as upgradeMonorepo, w as name, y as logger } from "./upgrade-CHym1gi7.mjs";
+import { E as cleanProjects, T as version, c as getCreateChoices, i as init, k as resolveCommandConfig, n as syncNpmMirror, o as createNewProject, r as setVscodeBinaryMirror, s as defaultTemplate, t as upgradeMonorepo, w as name, y as logger } from "./upgrade-CxCmaiou.mjs";
 import process from "node:process";
 import input from "@inquirer/input";
 import select from "@inquirer/select";

package/dist/index.cjs

@@ -1,4 +1,4 @@
-const require_upgrade = require('./upgrade-C7eRZs41.cjs');
+const require_upgrade = require('./upgrade-BTMNNTgu.cjs');
 
 exports.GitClient = require_upgrade.GitClient;
 exports.assetsDir = require_upgrade.assetsDir;

package/dist/index.mjs

@@ -1,3 +1,3 @@
-import { A as getWorkspaceData, C as templatesDir, D as defineMonorepoConfig, E as cleanProjects, M as GitClient, O as loadMonorepoConfig, S as rootDir, T as version, _ as toWorkspaceGitignorePath, a as createContext, b as assetsDir, c as getCreateChoices, d as escapeStringRegexp, f as isMatch, g as toPublishGitignorePath, h as isGitignoreFile, i as init, j as getWorkspacePackages, k as resolveCommandConfig, l as getTemplateMap, m as isFileChanged, n as syncNpmMirror, o as createNewProject, p as getFileHash, r as setVscodeBinaryMirror, t as upgradeMonorepo, u as templateMap, v as isIgnorableFsError, w as name, x as packageDir, y as logger } from "./upgrade-CHym1gi7.mjs";
+import { A as getWorkspaceData, C as templatesDir, D as defineMonorepoConfig, E as cleanProjects, M as GitClient, O as loadMonorepoConfig, S as rootDir, T as version, _ as toWorkspaceGitignorePath, a as createContext, b as assetsDir, c as getCreateChoices, d as escapeStringRegexp, f as isMatch, g as toPublishGitignorePath, h as isGitignoreFile, i as init, j as getWorkspacePackages, k as resolveCommandConfig, l as getTemplateMap, m as isFileChanged, n as syncNpmMirror, o as createNewProject, p as getFileHash, r as setVscodeBinaryMirror, t as upgradeMonorepo, u as templateMap, v as isIgnorableFsError, w as name, x as packageDir, y as logger } from "./upgrade-CxCmaiou.mjs";
 
 export { GitClient, assetsDir, cleanProjects, createContext, createNewProject, defineMonorepoConfig, escapeStringRegexp, getCreateChoices, getFileHash, getTemplateMap, getWorkspaceData, getWorkspacePackages, init, isFileChanged, isGitignoreFile, isIgnorableFsError, isMatch, loadMonorepoConfig, logger, name, packageDir, resolveCommandConfig, rootDir, setVscodeBinaryMirror, syncNpmMirror, templateMap, templatesDir, toPublishGitignorePath, toWorkspaceGitignorePath, upgradeMonorepo, version };

package/dist/{upgrade-C7eRZs41.cjs → upgrade-BTMNNTgu.cjs}

@@ -5,9 +5,7 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __commonJS = (cb, mod) => function() {
-	return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
+var __commonJSMin = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __copyProps = (to, from, except, desc) => {
 	if (from && typeof from === "object" || typeof from === "function") {
 		for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
@@ -285,12 +283,12 @@ async function getWorkspaceData(cwd, options) {
 * Copyright (c) 2014-present, Jon Schlinkert.
 * Released under the MIT License.
 */
-var require_is_primitive = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/is-primitive@3.0.1/node_modules/is-primitive/index.js": ((exports, module) => {
+var require_is_primitive = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 	module.exports = function isPrimitive$1(val) {
 		if (typeof val === "object") return val === null;
 		return typeof val !== "function";
 	};
-}) });
+}));
 
 //#endregion
 //#region ../../node_modules/.pnpm/isobject@3.0.1/node_modules/isobject/index.js
@@ -300,11 +298,11 @@ var require_is_primitive = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnp
 * Copyright (c) 2014-2017, Jon Schlinkert.
 * Released under the MIT License.
 */
-var require_isobject = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/isobject@3.0.1/node_modules/isobject/index.js": ((exports, module) => {
+var require_isobject = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 	module.exports = function isObject$3(val) {
 		return val != null && typeof val === "object" && Array.isArray(val) === false;
 	};
-}) });
+}));
 
 //#endregion
 //#region ../../node_modules/.pnpm/is-plain-object@2.0.4/node_modules/is-plain-object/index.js
@@ -314,7 +312,7 @@ var require_isobject = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/is
 * Copyright (c) 2014-2017, Jon Schlinkert.
 * Released under the MIT License.
 */
-var require_is_plain_object = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/is-plain-object@2.0.4/node_modules/is-plain-object/index.js": ((exports, module) => {
+var require_is_plain_object = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 	var isObject$1 = require_isobject();
 	function isObjectObject(o) {
 		return isObject$1(o) === true && Object.prototype.toString.call(o) === "[object Object]";
@@ -329,7 +327,7 @@ var require_is_plain_object = /* @__PURE__ */ __commonJS({ "../../node_modules/.
 		if (prot.hasOwnProperty("isPrototypeOf") === false) return false;
 		return true;
 	};
-}) });
+}));
 
 //#endregion
 //#region ../../node_modules/.pnpm/set-value@4.1.0/node_modules/set-value/index.js
@@ -339,7 +337,7 @@ var require_is_plain_object = /* @__PURE__ */ __commonJS({ "../../node_modules/.
 * Copyright (c) Jon Schlinkert (https://github.com/jonschlinkert).
 * Released under the MIT License.
 */
-var require_set_value = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/set-value@4.1.0/node_modules/set-value/index.js": ((exports, module) => {
+var require_set_value = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 	const { deleteProperty } = Reflect;
 	const isPrimitive = require_is_primitive();
 	const isPlainObject = require_is_plain_object();
@@ -443,7 +441,7 @@ var require_set_value = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/s
 		setValue.cache = /* @__PURE__ */ new Map();
 	};
 	module.exports = setValue;
-}) });
+}));
 
 //#endregion
 //#region src/core/config.ts
@@ -531,7 +529,7 @@ async function cleanProjects(cwd) {
 //#endregion
 //#region package.json
 var name = "@icebreakers/monorepo";
-var version = "3.0.1";
+var version = "3.0.3";
 
 //#endregion
 //#region src/constants.ts

package/dist/{upgrade-CHym1gi7.mjs → upgrade-CxCmaiou.mjs}

@@ -29,9 +29,7 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __commonJS = (cb, mod) => function() {
-	return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
+var __commonJSMin = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __copyProps = (to, from, except, desc) => {
 	if (from && typeof from === "object" || typeof from === "function") {
 		for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
@@ -274,12 +272,12 @@ async function getWorkspaceData(cwd, options) {
 * Copyright (c) 2014-present, Jon Schlinkert.
 * Released under the MIT License.
 */
-var require_is_primitive = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/is-primitive@3.0.1/node_modules/is-primitive/index.js": ((exports, module) => {
+var require_is_primitive = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 	module.exports = function isPrimitive$1(val) {
 		if (typeof val === "object") return val === null;
 		return typeof val !== "function";
 	};
-}) });
+}));
 
 //#endregion
 //#region ../../node_modules/.pnpm/isobject@3.0.1/node_modules/isobject/index.js
@@ -289,11 +287,11 @@ var require_is_primitive = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnp
 * Copyright (c) 2014-2017, Jon Schlinkert.
 * Released under the MIT License.
 */
-var require_isobject = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/isobject@3.0.1/node_modules/isobject/index.js": ((exports, module) => {
+var require_isobject = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 	module.exports = function isObject$3(val) {
 		return val != null && typeof val === "object" && Array.isArray(val) === false;
 	};
-}) });
+}));
 
 //#endregion
 //#region ../../node_modules/.pnpm/is-plain-object@2.0.4/node_modules/is-plain-object/index.js
@@ -303,7 +301,7 @@ var require_isobject = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/is
 * Copyright (c) 2014-2017, Jon Schlinkert.
 * Released under the MIT License.
 */
-var require_is_plain_object = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/is-plain-object@2.0.4/node_modules/is-plain-object/index.js": ((exports, module) => {
+var require_is_plain_object = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 	var isObject$1 = require_isobject();
 	function isObjectObject(o) {
 		return isObject$1(o) === true && Object.prototype.toString.call(o) === "[object Object]";
@@ -318,7 +316,7 @@ var require_is_plain_object = /* @__PURE__ */ __commonJS({ "../../node_modules/.
 		if (prot.hasOwnProperty("isPrototypeOf") === false) return false;
 		return true;
 	};
-}) });
+}));
 
 //#endregion
 //#region ../../node_modules/.pnpm/set-value@4.1.0/node_modules/set-value/index.js
@@ -328,7 +326,7 @@ var require_is_plain_object = /* @__PURE__ */ __commonJS({ "../../node_modules/.
 * Copyright (c) Jon Schlinkert (https://github.com/jonschlinkert).
 * Released under the MIT License.
 */
-var require_set_value = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/set-value@4.1.0/node_modules/set-value/index.js": ((exports, module) => {
+var require_set_value = /* @__PURE__ */ __commonJSMin(((exports, module) => {
 	const { deleteProperty } = Reflect;
 	const isPrimitive = require_is_primitive();
 	const isPlainObject = require_is_plain_object();
@@ -432,7 +430,7 @@ var require_set_value = /* @__PURE__ */ __commonJS({ "../../node_modules/.pnpm/s
 		setValue.cache = /* @__PURE__ */ new Map();
 	};
 	module.exports = setValue;
-}) });
+}));
 
 //#endregion
 //#region src/core/config.ts
@@ -520,7 +518,7 @@ async function cleanProjects(cwd) {
 //#endregion
 //#region package.json
 var name = "@icebreakers/monorepo";
-var version = "3.0.1";
+var version = "3.0.3";
 
 //#endregion
 //#region src/constants.ts

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@icebreakers/monorepo",
   "type": "module",
-  "version": "3.0.1",
+  "version": "3.0.3",
   "description": "The icebreaker's monorepo manager",
   "author": "ice breaker <1324318532@qq.com>",
   "license": "MIT",
@@ -64,8 +64,8 @@
     "@pnpm/find-workspace-dir": "^1000.1.3",
     "@pnpm/logger": "^1001.0.1",
     "@pnpm/types": "^1001.0.1",
-    "@pnpm/worker": "^1000.3.3",
-    "@pnpm/workspace.find-packages": "^1000.0.46",
+    "@pnpm/worker": "^1000.4.0",
+    "@pnpm/workspace.find-packages": "^1000.0.47",
     "@pnpm/workspace.read-manifest": "^1000.2.7",
     "c12": "^3.3.2",
     "commander": "^14.0.2",

package/templates/apps/client/package.json

@@ -4,7 +4,7 @@
   "version": "0.0.0",
   "private": true,
   "scripts": {
-    "dev": "vite",
+    "dev": "vite --host",
     "build": "vue-tsc -b && vite build",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
@@ -15,33 +15,37 @@
   },
   "dependencies": {
     "@faker-js/faker": "^10.1.0",
-    "@tanstack/vue-query": "^5.91.2",
+    "@tanstack/vue-query": "^5.92.0",
+    "@tanstack/vue-query-devtools": "^6.1.2",
     "@tanstack/vue-table": "^8.21.3",
     "@tanstack/vue-virtual": "^3.13.12",
-    "@trpc/client": "^11.7.1",
+    "@trpc/client": "^11.7.2",
+    "clsx": "^2.1.1",
     "pinia": "^3.0.4",
-    "vue": "^3.5.24",
-    "vue-i18n": "^11.1.12",
+    "tailwind-merge": "^3.4.0",
+    "tailwind-variants": "^3.2.2",
+    "vue": "^3.5.25",
+    "vue-i18n": "^11.2.2",
     "vue-router": "^4.6.3"
   },
   "devDependencies": {
-    "@cloudflare/vite-plugin": "^1.15.2",
+    "@cloudflare/vite-plugin": "^1.15.3",
     "@hono/node-server": "^1.19.6",
     "@hono/trpc-server": "^0.4.0",
     "@tailwindcss/vite": "^4.1.17",
-    "@trpc/server": "^11.7.1",
+    "@trpc/server": "^11.7.2",
     "@vitejs/plugin-vue": "^6.0.2",
     "@vitejs/plugin-vue-jsx": "^5.1.2",
     "@vue/tsconfig": "^0.8.1",
-    "hono": "^4.10.6",
+    "hono": "^4.10.7",
     "tailwindcss": "^4.1.17",
     "typescript": "~5.9.3",
-    "unplugin-vue-router": "^0.17.0",
+    "unplugin-vue-router": "^0.18.0",
     "vite": "^7.2.4",
     "vite-plugin-vue-devtools": "^8.0.5",
     "vite-tsconfig-paths": "^5.1.4",
-    "vue-tsc": "3.1.4",
-    "wrangler": "^4.50.0",
-    "zod": "^4.1.12"
+    "vue-tsc": "3.1.5",
+    "wrangler": "^4.51.0",
+    "zod": "^4.1.13"
   }
 }

package/templates/apps/client/src/App.vue

@@ -1,9 +1,11 @@
 <script setup lang="ts">
+import { VueQueryDevtools } from '@tanstack/vue-query-devtools'
 import { RouterView } from 'vue-router'
 </script>
 
 <template>
-  <RouterView />
+  <div>
+    <RouterView />
+  </div>
+  <VueQueryDevtools />
 </template>
-
-<style scoped></style>

package/templates/apps/client/src/main.ts

@@ -1,3 +1,4 @@
+import { VueQueryPlugin } from '@tanstack/vue-query'
 import { createPinia } from 'pinia'
 import { createApp } from 'vue'
 import App from './App.vue'
@@ -10,5 +11,6 @@ const app = createApp(App)
 app.use(router)
 app.use(pinia)
 app.use(i18n)
+app.use(VueQueryPlugin)
 
 app.mount('#app')

package/templates/apps/client/src/pages/index.vue

@@ -1,7 +1,11 @@
-<script setup lang="tsx">
-import { onMounted, ref } from 'vue'
+<script setup lang="ts">
+import { useQuery, useQueryClient } from '@tanstack/vue-query'
+import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
-import { client } from '../trpc'
+import { helloKeys } from '@/query-keys'
+import { client } from '@/trpc'
+
+type HelloResponse = Awaited<ReturnType<typeof client.hello.query>>
 
 const { t, locale } = useI18n()
 function changeLocale(lang: 'en' | 'zh') {
@@ -12,55 +16,341 @@ function toggleLocale() {
   changeLocale(locale.value === 'en' ? 'zh' : 'en')
 }
 
-const fetchData = ref<any>()
-
-async function getFetchData() {
-  const result = await client.hello.query('icebreakers')
-  fetchData.value = result
+function formatTime(timestamp?: number) {
+  if (!timestamp) {
+    return '-'
+  }
+  return new Intl.DateTimeFormat(undefined, {
+    hour: '2-digit',
+    minute: '2-digit',
+    second: '2-digit',
+  }).format(new Date(timestamp))
 }
 
-onMounted(() => {
-  getFetchData()
-  client.sayHello.query({ name: '2' })
-  // init()
+const queryClient = useQueryClient()
+const helloName = 'icebreakers' as const
+
+const helloQuery = useQuery<HelloResponse>({
+  queryKey: helloKeys.detail(helloName),
+  queryFn: () => client.hello.query(helloName),
+  staleTime: 30_000,
+  gcTime: 5 * 60_000,
+})
+
+const liveData = computed(() => ({
+  message: helloQuery.data.value?.message ?? '-',
+  time: helloQuery.data.value?.time ?? null,
+  formattedTime: formatTime(helloQuery.data.value?.time),
+}))
+
+const cachedHello = computed<HelloResponse | undefined>(() => {
+  const cached = queryClient.getQueryData<HelloResponse>(
+    helloKeys.detail(helloName),
+  )
+  return helloQuery.data.value ?? cached
+})
+
+const queryMeta = computed(() => ({
+  status: helloQuery.status.value,
+  fetchStatus: helloQuery.fetchStatus.value,
+  isFetching: helloQuery.isFetching.value,
+  isStale: helloQuery.isStale.value,
+  dataUpdatedAt: helloQuery.dataUpdatedAt.value,
+}))
+
+const helloErrorMessage = computed(() => {
+  const error = helloQuery.error.value
+  if (!error) {
+    return ''
+  }
+  if (error instanceof Error) {
+    return error.message
+  }
+  return String(error)
 })
 </script>
 
 <template>
-  <div>
-    <div
-      class="
-        flex min-h-screen items-center justify-center bg-black bg-gradient-to-br
-        p-4
-      "
-    >
+  <div class="min-h-screen bg-slate-950 text-slate-50">
+    <div class="mx-auto flex min-h-screen max-w-5xl flex-col gap-6 px-6 py-8">
+      <header
+        class="
+          rounded-2xl bg-linear-to-br from-slate-800 to-slate-900 p-6 shadow-xl
+          ring-1 ring-white/5
+        "
+      >
+        <div class="flex flex-wrap items-center justify-between gap-4">
+          <div class="space-y-2">
+            <p class="text-xs tracking-[0.2em] text-slate-400 uppercase">
+              TanStack Query + i18n
+            </p>
+            <h1 class="text-3xl leading-tight font-semibold">
+              {{ t('hello') }}
+            </h1>
+            <p class="text-sm text-slate-400">
+              Minimal data-fetch demo. Everything stays on screen for quick checks.
+            </p>
+          </div>
+          <div class="flex flex-wrap items-center gap-3">
+            <button
+              class="
+                rounded-full bg-white/15 px-4 py-2 text-sm font-medium
+                text-slate-50 shadow-sm transition
+                hover:scale-[1.02] hover:bg-white/25
+              "
+              @click="toggleLocale"
+            >
+              {{ t('toggleLocale') }}
+            </button>
+            <button
+              class="
+                rounded-full bg-emerald-500/90 px-4 py-2 text-sm font-semibold
+                text-emerald-950 shadow-sm transition
+                hover:scale-[1.02] hover:bg-emerald-400
+                disabled:opacity-60
+              "
+              :disabled="helloQuery.isFetching.value"
+              @click="helloQuery.refetch()"
+            >
+              {{ helloQuery.isFetching ? 'Refreshing…' : 'Refetch now' }}
+            </button>
+          </div>
+        </div>
+        <div
+          class="mt-4 flex flex-wrap items-center gap-3 text-xs text-slate-300"
+        >
+          <span
+            class="
+              inline-flex items-center gap-2 rounded-full bg-emerald-500/15 px-3
+              py-1 font-semibold text-emerald-200 ring-1 ring-emerald-500/30
+            "
+          >
+            <span class="size-2 rounded-full bg-emerald-400" />
+            Live data connected
+          </span>
+          <span
+            class="
+              rounded-full bg-white/5 px-3 py-1 font-semibold text-white/80
+              ring-1 ring-white/10
+            "
+          >
+            Status: {{ helloQuery.status }}
+          </span>
+          <span
+            v-if="helloQuery.isFetching"
+            class="
+              rounded-full bg-amber-500/15 px-3 py-1 font-semibold
+              text-amber-200 ring-1 ring-amber-500/30
+            "
+          >
+            Fetching…
+          </span>
+        </div>
+      </header>
+
       <div
         class="
-          space-y-6 rounded-2xl bg-white/20 p-8 text-center backdrop-blur-md
+          grid gap-4
+          md:grid-cols-2
         "
       >
-        <h1 class="animate-pulse text-4xl font-semibold text-white">
-          {{ t('hello') }}
-        </h1>
-        <button
+        <section
+          class="rounded-2xl bg-slate-900/70 p-5 shadow-lg ring-1 ring-white/5"
+        >
+          <div class="flex items-center justify-between gap-3">
+            <div>
+              <h2 class="text-lg font-semibold">
+                Live data
+              </h2>
+              <p class="text-xs text-slate-400">
+                Latest response from the server
+              </p>
+            </div>
+            <span
+              class="
+                rounded-full bg-white/10 px-3 py-1 text-xs font-semibold
+                text-white/90 ring-1 ring-white/10
+              "
+            >
+              {{ helloQuery.fetchStatus }}
+            </span>
+          </div>
+          <dl
+            class="
+              mt-4 grid gap-3
+              sm:grid-cols-2
+            "
+          >
+            <div
+              class="
+                rounded-lg bg-white/5 px-3 py-2 text-sm text-slate-100 ring-1
+                ring-white/10
+              "
+            >
+              <dt class="text-xs tracking-wide text-slate-400 uppercase">
+                Message
+              </dt>
+              <dd class="mt-1 font-semibold">
+                {{ liveData.message }}
+              </dd>
+            </div>
+            <div
+              class="
+                rounded-lg bg-white/5 px-3 py-2 text-sm text-slate-100 ring-1
+                ring-white/10
+              "
+            >
+              <dt class="text-xs tracking-wide text-slate-400 uppercase">
+                Server time
+              </dt>
+              <dd class="mt-1 font-semibold">
+                {{ liveData.formattedTime }}
+              </dd>
+            </div>
+          </dl>
+          <pre
+            class="
+              mt-4 max-h-48 overflow-auto rounded-lg bg-black/40 p-3 text-left
+              text-xs leading-relaxed text-slate-100 ring-1 ring-white/10
+            "
+          >{{ JSON.stringify(liveData, null, 2) }}</pre>
+          <p v-if="helloErrorMessage" class="mt-3 text-sm text-rose-200">
+            {{ helloErrorMessage }}
+          </p>
+        </section>
+
+        <section
+          class="rounded-2xl bg-slate-900/70 p-5 shadow-lg ring-1 ring-white/5"
+        >
+          <div class="flex items-center justify-between gap-3">
+            <div>
+              <h2 class="text-lg font-semibold">
+                Cache snapshot
+              </h2>
+              <p class="text-xs text-slate-400">
+                Result from getQueryData
+              </p>
+            </div>
+            <span
+              class="
+                rounded-full bg-emerald-500/15 px-3 py-1 text-xs font-semibold
+                text-emerald-100 ring-1 ring-emerald-500/30
+              "
+            >
+              {{ cachedHello ? 'Cached' : 'Empty' }}
+            </span>
+          </div>
+          <div
+            class="
+              mt-3 rounded-lg bg-white/5 px-3 py-2 text-sm text-slate-100 ring-1
+              ring-white/10
+            "
+          >
+            <p class="text-xs tracking-wide text-slate-400 uppercase">
+              Time
+            </p>
+            <p class="mt-1 font-semibold">
+              {{ formatTime(cachedHello?.time) }}
+            </p>
+          </div>
+          <pre
+            class="
+              mt-4 max-h-48 overflow-auto rounded-lg bg-black/40 p-3 text-left
+              text-xs leading-relaxed text-slate-100 ring-1 ring-white/10
+            "
+          >{{ JSON.stringify(cachedHello ?? '-', null, 2) }}</pre>
+        </section>
+
+        <section
           class="
-            transform rounded-full bg-white/30 px-5 py-2 text-white
-            backdrop-blur-sm transition
-            hover:scale-105
+            rounded-2xl bg-slate-900/70 p-5 shadow-lg ring-1 ring-white/5
+            md:col-span-2
           "
-          @click="toggleLocale"
         >
-          <div>{{ t('toggleLocale') }}</div>
-        </button>
-
-        <div class="rounded border border-white p-2">
-          <pre class="text-left text-white">
-{{ fetchData }}
-        </pre>
-          <button class="rounded bg-white/30 px-5 py-2 text-white" @click="getFetchData">
-            refetch
-          </button>
-        </div>
+          <div class="flex flex-wrap items-center justify-between gap-3">
+            <div>
+              <h2 class="text-lg font-semibold">
+                Query meta
+              </h2>
+              <p class="text-xs text-slate-400">
+                What TanStack Query is tracking
+              </p>
+            </div>
+            <span
+              class="
+                rounded-full bg-white/10 px-3 py-1 text-xs font-semibold
+                text-white/80 ring-1 ring-white/10
+              "
+            >
+              Updated: {{ formatTime(queryMeta.dataUpdatedAt) }}
+            </span>
+          </div>
+          <div
+            class="
+              mt-4 grid gap-3
+              sm:grid-cols-4
+            "
+          >
+            <div
+              class="
+                rounded-lg bg-white/5 px-3 py-2 text-xs text-slate-100 ring-1
+                ring-white/10
+              "
+            >
+              <p class="text-slate-400">
+                Status
+              </p>
+              <p class="mt-1 font-semibold">
+                {{ queryMeta.status }}
+              </p>
+            </div>
+            <div
+              class="
+                rounded-lg bg-white/5 px-3 py-2 text-xs text-slate-100 ring-1
+                ring-white/10
+              "
+            >
+              <p class="text-slate-400">
+                Fetch
+              </p>
+              <p class="mt-1 font-semibold">
+                {{ queryMeta.fetchStatus }}
+              </p>
+            </div>
+            <div
+              class="
+                rounded-lg bg-white/5 px-3 py-2 text-xs text-slate-100 ring-1
+                ring-white/10
+              "
+            >
+              <p class="text-slate-400">
+                Fetching?
+              </p>
+              <p class="mt-1 font-semibold">
+                {{ queryMeta.isFetching ? 'Yes' : 'No' }}
+              </p>
+            </div>
+            <div
+              class="
+                rounded-lg bg-white/5 px-3 py-2 text-xs text-slate-100 ring-1
+                ring-white/10
+              "
+            >
+              <p class="text-slate-400">
+                Stale?
+              </p>
+              <p class="mt-1 font-semibold">
+                {{ queryMeta.isStale ? 'Yes' : 'No' }}
+              </p>
+            </div>
+          </div>
+          <pre
+            class="
+              mt-4 max-h-48 overflow-auto rounded-lg bg-black/40 p-3 text-left
+              text-xs leading-relaxed text-slate-100 ring-1 ring-white/10
+            "
+          >{{ JSON.stringify(queryMeta, null, 2) }}</pre>
+        </section>
       </div>
     </div>
   </div>

package/templates/apps/client/src/query-keys.ts

@@ -0,0 +1,4 @@
+export const helloKeys = {
+  all: ['hello'] as const,
+  detail: (name: string) => [...helloKeys.all, { name }] as const,
+}

package/templates/apps/client/src/stores/i18n.ts

@@ -3,6 +3,7 @@ import { defineStore } from 'pinia'
 import { createI18n } from 'vue-i18n'
 
 export const i18n = createI18n({
+  legacy: false,
   locale: 'en',
   messages: {
     en: {

package/templates/apps/client/wrangler.jsonc

@@ -4,7 +4,10 @@
   "compatibility_date": "2025-10-16",
   "main": "./worker/fetch-entry.ts",
   "assets": {
-    "not_found_handling": "single-page-application"
+    "not_found_handling": "single-page-application",
+    "run_worker_first": [
+      "/api/*"
+    ]
   },
   "dev": {
     "port": 8787

package/templates/apps/server/package.json

@@ -24,10 +24,11 @@
     "dist"
   ],
   "scripts": {
-    "dev": "tsx watch src/node-entry.ts",
-    "start": "node dist/node-entry.js",
-    "build:watch": "tsup --watch --sourcemap",
-    "build": "tsup",
+    "dev": "wrangler dev",
+    "node:build:watch": "tsup --watch --sourcemap",
+    "node:build": "tsup",
+    "node:dev": "tsx watch src/node-entry.ts",
+    "node:start": "node dist/node-entry.js",
     "test": "vitest run",
     "test:dev": "vitest",
     "release": "pnpm publish",
@@ -35,7 +36,6 @@
     "lint:fix": "eslint . --fix",
     "deploy": "wrangler deploy",
     "cf-typegen": "wrangler types",
-    "worker:dev": "wrangler dev",
     "postinstall": "pnpm cf-typegen"
   },
   "publishConfig": {
@@ -52,8 +52,8 @@
   },
   "devDependencies": {
     "@hono/node-server": "^1.19.6",
-    "hono": "^4.10.6",
-    "wrangler": "^4.50.0",
-    "zod": "^4.1.12"
+    "hono": "^4.10.7",
+    "wrangler": "^4.51.0",
+    "zod": "^4.1.13"
   }
 }

package/templates/packages/vue-lib-template/package.json

@@ -51,11 +51,11 @@
     "@vue/tsconfig": "^0.8.1",
     "jsdom": "^27.2.0",
     "tailwindcss": "^4.1.17",
-    "unplugin-vue-router": "^0.17.0",
+    "unplugin-vue-router": "^0.18.0",
     "vite": "^7.2.4",
     "vite-plugin-dts": "^4.5.4",
-    "vue": "^3.5.24",
+    "vue": "^3.5.25",
     "vue-router": "^4.6.3",
-    "vue-tsc": "^3.1.4"
+    "vue-tsc": "^3.1.5"
   }
 }