feat: 集成 Wrangler 并添加 KV 支持

.gitignore

@@ -29,3 +29,10 @@ coverage
 
 test-results/
 playwright-report/
+
+# wrangler files
+.wrangler
+.dev.vars*
+!.dev.vars.example
+.env*
+!.env.example

package.json

@@ -10,7 +10,8 @@
   "scripts": {
     "dev": "vite --port 4730 --host --strictPort",
     "build": "run-p type-check \"build-only {@}\" --",
-    "preview": "vite preview",
+    "preview:vite": "vite preview",
+    "preview": "pnpm run build && wrangler dev",
     "test:unit": "vitest",
     "test:e2e": "playwright test",
     "build-only": "vite build",
@@ -19,10 +20,11 @@
     "lint:eslint": "eslint . --fix",
     "lint": "run-s lint:*",
     "format": "prettier --write src/",
-    "wrangler:deploy:preview": "wrangler pages deploy dist --project-name=vue-ts-example-2025 --branch=preview",
+    "-wrangler:pages:deploy:preview": "wrangler pages deploy dist --project-name=vue-ts-example-2025 --branch=preview",
-    "wrangler:deploy:prod": "wrangler pages deploy dist --project-name=vue-ts-example-2025",
+    "-wrangler:pages:deploy:prod": "wrangler pages deploy dist --project-name=vue-ts-example-2025",
-    "deploy:preview": "run-s build-only wrangler:deploy:preview",
+    "-deploy:preview": "run-s build-only wrangler:pages:deploy:preview",
-    "deploy:prod": "run-s build-only wrangler:deploy:prod",
+    "-deploy:prod": "run-s build-only wrangler:pages:deploy:prod",
+    "deploy": "pnpm run build && wrangler deploy",
     "cf-typegen": "wrangler types"
   },
   "dependencies": {

server/index.ts

@@ -1,12 +1,24 @@
 export default {
-	fetch(request) {
+  async fetch(request, env) {
-		const url = new URL(request.url);
+    const url = new URL(request.url)
+
+    if (url.pathname.startsWith('/api/')) {
+      // write a key-value pair
+      await env.KV.put('KEY', 'VALUE')
+      // read a key-value pair
+      const value = await env.KV.get('KEY')
+      // list all key-value pairs
+      const allKeys = await env.KV.list()
+      // delete a key-value pair
+      await env.KV.delete('KEY')
 
-		if (url.pathname.startsWith("/api/")) {
       return Response.json({
-				name: "Cloudflare",
+        name: 'Cloudflare',
-			});
+        value,
+        valueAfterDelete: await env.KV.get('KEY'),
+        allKeys,
+      })
     }
-		return new Response(null, { status: 404 });
+    return new Response(null, { status: 404 })
   },
-} satisfies ExportedHandler<Env>;
+} satisfies ExportedHandler<Env>

worker-configuration.d.ts

@@ -1,8 +1,9 @@
 /* eslint-disable */
-// Generated by Wrangler by running `wrangler types` (hash: 869ac3b4ce0f52ba3b2e0bc70c49089e)
+// Generated by Wrangler by running `wrangler types` (hash: a5d3a0d06638640f4072385a766cb44d)
 // Runtime types generated with workerd@1.20250902.0 2025-09-09 
 declare namespace Cloudflare {
 	interface Env {
+		KV: KVNamespace;
 	}
 }
 interface Env extends Cloudflare.Env {}

wrangler.jsonc

@@ -43,4 +43,15 @@
    * https://developers.cloudflare.com/workers/wrangler/configuration/#service-bindings
    */
   // "services": [{ "binding": "MY_SERVICE", "service": "my-service" }]
+
+  /**
+   * KV Namespaces
+   * https://developers.cloudflare.com/kv/
+   */
+  "kv_namespaces": [
+    {
+      "binding": "KV",
+      "id": "cf60206f0d994aa5ac7d4a4b853ced18",
+    },
+  ],
 }