create-cloudflare 0.0.0-a64aa1b94 → 0.0.0-a67cdbfc4

package/templates-experimental/hello-world-with-assets/js/test/index.spec.js

@@ -1,20 +1,41 @@
-import { env, createExecutionContext, waitOnExecutionContext, SELF } from 'cloudflare:test';
+import { env, ctx, createExecutionContext, waitOnExecutionContext, SELF } from 'cloudflare:test';
 import { describe, it, expect } from 'vitest';
 import worker from '../src';
 
-describe('Hello World worker', () => {
-	it('responds with Hello World! (unit style)', async () => {
-		const request = new Request('http://example.com');
-		// Create an empty context to pass to `worker.fetch()`.
-		const ctx = createExecutionContext();
-		const response = await worker.fetch(request, env, ctx);
-		// Wait for all `Promise`s passed to `ctx.waitUntil()` to settle before running test assertions
-		await waitOnExecutionContext(ctx);
-		expect(await response.text()).toMatchInlineSnapshot(`"Hello World!"`);
+describe('Hello World user worker', () => {
+	describe('request for /message', () => {
+		it('/ responds with "Hello, World!" (unit style)', async () => {
+			const request = new Request('http://example.com/message');
+			// Create an empty context to pass to `worker.fetch()`.
+			const ctx = createExecutionContext();
+			const response = await worker.fetch(request, env, ctx);
+			// Wait for all `Promise`s passed to `ctx.waitUntil()` to settle before running test assertions
+			await waitOnExecutionContext(ctx);
+			expect(await response.text()).toMatchInlineSnapshot(`"Hello, World!"`);
+		});
+
+		it('responds with "Hello, World!" (integration style)', async () => {
+			const request = new Request('http://example.com/message');
+			const response = await SELF.fetch(request, env, ctx);
+			expect(await response.text()).toMatchInlineSnapshot(`"Hello, World!"`);
+		});
 	});
 
-	it('responds with Hello World! (integration style)', async () => {
-		const response = await SELF.fetch(request, env, ctx);
-		expect(await response.text()).toMatchInlineSnapshot(`"Hello World!"`);
+	describe('request for /random', () => {
+		it('/ responds with a random UUID (unit style)', async () => {
+			const request = new Request('http://example.com/random');
+			// Create an empty context to pass to `worker.fetch()`.
+			const ctx = createExecutionContext();
+			const response = await worker.fetch(request, env, ctx);
+			// Wait for all `Promise`s passed to `ctx.waitUntil()` to settle before running test assertions
+			await waitOnExecutionContext(ctx);
+			expect(await response.text()).toMatch(/[a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{12}/);
+		});
+
+		it('responds with a random UUID (integration style)', async () => {
+			const request = new Request('http://example.com/random');
+			const response = await SELF.fetch(request, env, ctx);
+			expect(await response.text()).toMatch(/[a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{12}/);
+		});
 	});
 });

package/templates-experimental/hello-world-with-assets/js/wrangler.toml

@@ -3,4 +3,10 @@ name = "<TBD>"
 main = "src/index.js"
 compatibility_date = "<TBD>"
 compatibility_flags = ["nodejs_compat"]
-experimental_assets = { directory = "./public", binding = "ASSETS" }
+assets = { directory = "./public", binding = "ASSETS" }
+
+# Workers Logs
+# Docs: https://developers.cloudflare.com/workers/observability/logs/workers-logs/
+# Configuration: https://developers.cloudflare.com/workers/observability/logs/workers-logs/#enable-workers-logs
+[observability]
+enabled = true

package/templates-experimental/hello-world-with-assets/py/public/index.html

@@ -7,13 +7,25 @@
 	</head>
 	<body>
 		<h1 id="heading"></h1>
+		<button id="button">Fetch a random UUID</button>
+		<div id="random"></div>
 		<script>
-			fetch("/api")
+			fetch('/message')
 				.then((resp) => resp.text())
 				.then((text) => {
-					const h1 = document.getElementById("heading");
+					const h1 = document.getElementById('heading');
 					h1.textContent = text;
 				});
+
+			const button = document.getElementById("button");
+			button.addEventListener("click", () => {
+				fetch('/random')
+					.then((resp) => resp.text())
+					.then((text) => {
+						const random = document.getElementById('random');
+						random.textContent = text;
+					});
+			});
 		</script>
 	</body>
 </html>

package/templates-experimental/hello-world-with-assets/py/src/entry.py

@@ -1,4 +1,9 @@
-from js import Response
+from js import Response, URL, crypto
 
 async def on_fetch(request, env):
-    return Response.new("Hello World!")
+	url = URL.new(request.url)
+	if url.pathname == '/message':
+		return Response.new('Hello, World!')
+	if url.pathname == '/random':
+		return Response.new(crypto.randomUUID())
+	return Response.new('Not Found', {'status': 404})

package/templates-experimental/hello-world-with-assets/py/wrangler.toml

@@ -3,4 +3,10 @@ name = "<TBD>"
 main = "src/entry.py"
 compatibility_flags = ["python_workers"]
 compatibility_date = "<TBD>"
-experimental_assets = { directory = "./public", binding = "ASSETS" }
+assets = { directory = "./public", binding = "ASSETS" }
+
+# Workers Logs
+# Docs: https://developers.cloudflare.com/workers/observability/logs/workers-logs/
+# Configuration: https://developers.cloudflare.com/workers/observability/logs/workers-logs/#enable-workers-logs
+[observability]
+enabled = true

package/templates-experimental/hello-world-with-assets/ts/public/index.html

@@ -7,13 +7,25 @@
 	</head>
 	<body>
 		<h1 id="heading"></h1>
+		<button id="button">Fetch a random UUID</button>
+		<div id="random"></div>
 		<script>
-			fetch('/api')
+			fetch('/message')
 				.then((resp) => resp.text())
 				.then((text) => {
 					const h1 = document.getElementById('heading');
 					h1.textContent = text;
 				});
+
+			const button = document.getElementById("button");
+			button.addEventListener("click", () => {
+				fetch('/random')
+					.then((resp) => resp.text())
+					.then((text) => {
+						const random = document.getElementById('random');
+						random.textContent = text;
+					});
+			});
 		</script>
 	</body>
 </html>

package/templates-experimental/hello-world-with-assets/ts/src/index.ts

@@ -12,7 +12,15 @@
  */
 
 export default {
-	async fetch(_request, _env, _ctx): Promise<Response> {
-		return new Response('Hello World!');
+	async fetch(request, env, ctx): Promise<Response> {
+		const url = new URL(request.url);
+		switch (url.pathname) {
+			case '/message':
+				return new Response('Hello, World!');
+			case '/random':
+				return new Response(crypto.randomUUID());
+			default:
+				return new Response('Not Found', { status: 404 });
+		}
 	},
 } satisfies ExportedHandler<Env>;

package/templates-experimental/hello-world-with-assets/ts/test/index.spec.ts

@@ -1,25 +1,41 @@
-// test/index.spec.ts
-import { env, createExecutionContext, waitOnExecutionContext, SELF } from 'cloudflare:test';
+import { env, ctx, createExecutionContext, waitOnExecutionContext, SELF } from 'cloudflare:test';
 import { describe, it, expect } from 'vitest';
-import worker from '../src/index';
+import worker from '../src';
 
-// For now, you'll need to do something like this to get a correctly-typed
-// `Request` to pass to `worker.fetch()`.
-const IncomingRequest = Request<unknown, IncomingRequestCfProperties>;
+describe('Hello World user worker', () => {
+	describe('request for /message', () => {
+		it('/ responds with "Hello, World!" (unit style)', async () => {
+			const request = new Request('http://example.com/message');
+			// Create an empty context to pass to `worker.fetch()`.
+			const ctx = createExecutionContext();
+			const response = await worker.fetch(request, env, ctx);
+			// Wait for all `Promise`s passed to `ctx.waitUntil()` to settle before running test assertions
+			await waitOnExecutionContext(ctx);
+			expect(await response.text()).toMatchInlineSnapshot(`"Hello, World!"`);
+		});
 
-describe('Hello World worker', () => {
-	it('responds with Hello World! (unit style)', async () => {
-		const request = new IncomingRequest('http://example.com');
-		// Create an empty context to pass to `worker.fetch()`.
-		const ctx = createExecutionContext();
-		const response = await worker.fetch(request, env, ctx);
-		// Wait for all `Promise`s passed to `ctx.waitUntil()` to settle before running test assertions
-		await waitOnExecutionContext(ctx);
-		expect(await response.text()).toMatchInlineSnapshot(`"Hello World!"`);
+		it('responds with "Hello, World!" (integration style)', async () => {
+			const request = new Request('http://example.com/message');
+			const response = await SELF.fetch(request, env, ctx);
+			expect(await response.text()).toMatchInlineSnapshot(`"Hello, World!"`);
+		});
 	});
 
-	it('responds with Hello World! (integration style)', async () => {
-		const response = await SELF.fetch('https://example.com');
-		expect(await response.text()).toMatchInlineSnapshot(`"Hello World!"`);
+	describe('request for /random', () => {
+		it('/ responds with a random UUID (unit style)', async () => {
+			const request = new Request('http://example.com/random');
+			// Create an empty context to pass to `worker.fetch()`.
+			const ctx = createExecutionContext();
+			const response = await worker.fetch(request, env, ctx);
+			// Wait for all `Promise`s passed to `ctx.waitUntil()` to settle before running test assertions
+			await waitOnExecutionContext(ctx);
+			expect(await response.text()).toMatch(/[a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{12}/);
+		});
+
+		it('responds with a random UUID (integration style)', async () => {
+			const request = new Request('http://example.com/random');
+			const response = await SELF.fetch(request, env, ctx);
+			expect(await response.text()).toMatch(/[a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{12}/);
+		});
 	});
 });

package/templates-experimental/hello-world-with-assets/ts/wrangler.toml

@@ -3,4 +3,10 @@ name = "<TBD>"
 main = "src/index.ts"
 compatibility_date = "<TBD>"
 compatibility_flags = ["nodejs_compat"]
-experimental_assets = { directory = "./public", binding = "ASSETS" }
+assets = { directory = "./public", binding = "ASSETS" }
+
+# Workers Logs
+# Docs: https://developers.cloudflare.com/workers/observability/logs/workers-logs/
+# Configuration: https://developers.cloudflare.com/workers/observability/logs/workers-logs/#enable-workers-logs
+[observability]
+enabled = true

package/templates-experimental/hono/c3.ts

@@ -0,0 +1,43 @@
+import { logRaw } from "@cloudflare/cli";
+import { runFrameworkGenerator } from "frameworks/index";
+import { detectPackageManager } from "helpers/packageManagers";
+import type { TemplateConfig } from "../../src/templates";
+import type { C3Context } from "types";
+
+const generate = async (ctx: C3Context) => {
+	const { name: pm } = detectPackageManager();
+
+	await runFrameworkGenerator(ctx, [
+		ctx.project.name,
+		"--template",
+		"cloudflare-workers",
+		"--install",
+		"--pm",
+		pm,
+	]);
+
+	logRaw(""); // newline
+};
+
+const config: TemplateConfig = {
+	configVersion: 1,
+	id: "hono",
+	frameworkCli: "create-hono",
+	displayName: "Hono",
+	copyFiles: {
+		path: "./templates",
+	},
+	platform: "workers",
+	path: "templates-experimental/hono",
+	generate,
+	transformPackageJson: async () => ({
+		scripts: {
+			dev: "wrangler dev",
+			deploy: "wrangler deploy --minify",
+			"cf-typegen": "wrangler types --env-interface CloudflareBindings",
+		},
+	}),
+	devScript: "dev",
+	deployScript: "deploy",
+};
+export default config;

package/templates-experimental/hono/templates/public/index.html

@@ -0,0 +1,19 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>Hello, World!</title>
+	</head>
+	<body>
+		<h1 id="heading"></h1>
+		<script>
+			fetch('/message')
+				.then((resp) => resp.text())
+				.then((text) => {
+					const h1 = document.getElementById('heading');
+					h1.textContent = text;
+				});
+		</script>
+	</body>
+</html>

package/templates-experimental/hono/templates/src/index.ts

@@ -0,0 +1,9 @@
+import { Hono } from "hono";
+
+const app = new Hono<{ Bindings: CloudflareBindings }>();
+
+app.get("/message", (c) => {
+  return c.text("Hello Hono!");
+});
+
+export default app;

package/templates-experimental/hono/templates/worker-configuration.d.ts

@@ -0,0 +1,4 @@
+// Generated by Wrangler
+// After adding bindings to `wrangler.toml`, regenerate this interface via `npm run cf-typegen`
+interface CloudflareBindings {
+}

package/templates-experimental/hono/templates/wrangler.toml

@@ -0,0 +1,5 @@
+#:schema node_modules/wrangler/config-schema.json
+name = "<TBD>"
+main = "src/index.ts"
+compatibility_date = "<TBD>"
+assets = { directory = "./public", binding = "ASSETS" }

package/templates-experimental/next/c3.ts

@@ -0,0 +1,52 @@
+import { brandColor, dim } from "@cloudflare/cli/colors";
+import { runFrameworkGenerator } from "frameworks/index";
+import { installPackages } from "helpers/packages";
+import type { TemplateConfig } from "../../src/templates";
+import type { C3Context } from "types";
+
+const generate = async (ctx: C3Context) => {
+	await runFrameworkGenerator(ctx, [
+		ctx.project.name,
+		"--ts",
+		"--tailwind",
+		"--eslint",
+		"--app",
+		"--import-alias",
+		"@/*",
+		"--src-dir",
+	]);
+};
+
+const configure = async () => {
+	const packages = ["@opennextjs/cloudflare", "@cloudflare/workers-types"];
+	await installPackages(packages, {
+		dev: true,
+		startText: "Adding the Cloudflare adapter",
+		doneText: `${brandColor(`installed`)} ${dim(packages.join(", "))}`,
+	});
+};
+
+export default {
+	configVersion: 1,
+	id: "next",
+	frameworkCli: "create-next-app",
+	platform: "workers",
+	displayName: "Next (using Node.js compat + Workers Assets)",
+	path: "templates-experimental/next",
+	copyFiles: {
+		path: "./templates",
+	},
+	generate,
+	configure,
+	transformPackageJson: async () => ({
+		scripts: {
+			deploy: `cloudflare && wrangler deploy`,
+			preview: `cloudflare && wrangler dev`,
+			"cf-typegen": `wrangler types --env-interface CloudflareEnv env.d.ts`,
+		},
+	}),
+	devScript: "dev",
+	previewScript: "preview",
+	deployScript: "deploy",
+	compatibilityFlags: ["nodejs_compat"],
+} as TemplateConfig;

package/templates-experimental/next/templates/__dot__gitignore

@@ -0,0 +1,42 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+
+# Cloudflare related
+/.save.next
+/.worker-next
+/.wrangler

package/templates-experimental/next/templates/env.d.ts

@@ -0,0 +1,5 @@
+// Generated by Wrangler
+// by running `wrangler types --env-interface CloudflareEnv env.d.ts`
+
+interface CloudflareEnv {
+}

package/templates-experimental/next/templates/wrangler.toml

@@ -0,0 +1,12 @@
+#:schema node_modules/wrangler/config-schema.json
+name = "<app-name>"
+main = ".worker-next/index.mjs"
+
+compatibility_date = "2024-09-26"
+compatibility_flags = ["nodejs_compat"]
+
+# Minification helps to keep the Worker bundle size down and improve start up time.
+minify = true
+
+# Use the new Workers + Assets to host the static frontend files
+assets = { directory = ".worker-next/assets", binding = "ASSETS" }

package/templates-experimental/nuxt/templates/wrangler.toml

@@ -2,4 +2,10 @@
 name = "<TBD>"
 compatibility_date = "<TBD>"
 main = "./dist/worker/index.js"
-experimental_assets = { directory = "./dist/public", binding = "ASSETS" }
+assets = { directory = "./dist/public", binding = "ASSETS" }
+
+# Workers Logs
+# Docs: https://developers.cloudflare.com/workers/observability/logs/workers-logs/
+# Configuration: https://developers.cloudflare.com/workers/observability/logs/workers-logs/#enable-workers-logs
+[observability]
+enabled = true

package/templates-experimental/qwik/c3.ts

@@ -13,7 +13,7 @@ import type { C3Context } from "types";
 const { npm, npx } = detectPackageManager();
 
 const generate = async (ctx: C3Context) => {
-	await runFrameworkGenerator(ctx, ["basic", ctx.project.name]);
+	await runFrameworkGenerator(ctx, ["playground", ctx.project.name]);
 };
 
 const configure = async (ctx: C3Context) => {

package/templates-experimental/qwik/templates/wrangler.toml

@@ -3,4 +3,10 @@ name = "<TBD>"
 compatibility_date = "<TBD>"
 compatibility_flags = ["nodejs_compat"]
 main = "./dist/_worker.js"
-experimental_assets = { directory = "./dist", binding = "ASSET" }
+assets = { directory = "./dist", binding = "ASSET" }
+
+# Workers Logs
+# Docs: https://developers.cloudflare.com/workers/observability/logs/workers-logs/
+# Configuration: https://developers.cloudflare.com/workers/observability/logs/workers-logs/#enable-workers-logs
+[observability]
+enabled = true

package/templates-experimental/remix/templates/wrangler.toml

@@ -2,4 +2,10 @@
 name = "<TBD>"
 compatibility_date = "<TBD>"
 main = "./build/worker/index.js"
-experimental_assets = { directory = "./build/client" }
+assets = { directory = "./build/client" }
+
+# Workers Logs
+# Docs: https://developers.cloudflare.com/workers/observability/logs/workers-logs/
+# Configuration: https://developers.cloudflare.com/workers/observability/logs/workers-logs/#enable-workers-logs
+[observability]
+enabled = true

package/templates-experimental/solid/templates/wrangler.toml

@@ -3,4 +3,10 @@ name = "<TBD>"
 compatibility_date = "<TBD>"
 compatibility_flags = ["nodejs_compat"]
 main = "./dist/worker/index.js"
-experimental_assets = { directory = "./dist/public", binding = "ASSETS" }
+assets = { directory = "./dist/public", binding = "ASSETS" }
+
+# Workers Logs
+# Docs: https://developers.cloudflare.com/workers/observability/logs/workers-logs/
+# Configuration: https://developers.cloudflare.com/workers/observability/logs/workers-logs/#enable-workers-logs
+[observability]
+enabled = true

package/templates-experimental/svelte/js/wrangler.toml

@@ -2,4 +2,10 @@
 name = "<TBD>"
 compatibility_date = "<TBD>"
 main = ".svelte-kit/cloudflare/_worker.js"
-experimental_assets = { directory = ".svelte-kit/cloudflare", binding = "ASSETS" }
+assets = { directory = ".svelte-kit/cloudflare", binding = "ASSETS" }
+
+# Workers Logs
+# Docs: https://developers.cloudflare.com/workers/observability/logs/workers-logs/
+# Configuration: https://developers.cloudflare.com/workers/observability/logs/workers-logs/#enable-workers-logs
+[observability]
+enabled = true

package/templates-experimental/svelte/ts/wrangler.toml

@@ -2,4 +2,10 @@
 name = "<TBD>"
 compatibility_date = "<TBD>"
 main = ".svelte-kit/cloudflare/_worker.js"
-experimental_assets = { directory = ".svelte-kit/cloudflare", binding = "ASSETS" }
+assets = { directory = ".svelte-kit/cloudflare", binding = "ASSETS" }
+
+# Workers Logs
+# Docs: https://developers.cloudflare.com/workers/observability/logs/workers-logs/
+# Configuration: https://developers.cloudflare.com/workers/observability/logs/workers-logs/#enable-workers-logs
+[observability]
+enabled = true

package/templates-experimental/angular/templates/src/.assetsignore

@@ -1,4 +0,0 @@
-_worker.js
-_routes.json
-_headers
-_redirects

package/templates-experimental/angular/templates/tools/copy-files.mjs

@@ -1,9 +0,0 @@
-// Copy the files over so that they can be uploaded by the pages publish command.
-import fs from "node:fs";
-import { join } from "node:path";
-import { client, cloudflare, ssr, worker } from "./paths.mjs";
-
-fs.cpSync(client, cloudflare, { recursive: true });
-fs.cpSync(ssr, worker, { recursive: true });
-
-fs.renameSync(join(worker, "server.mjs"), join(worker, "index.js"));

package/templates-experimental/angular/templates/tools/paths.mjs

@@ -1,9 +0,0 @@
-import path from "node:path";
-import { fileURLToPath } from "node:url";
-
-const dirname = path.dirname(fileURLToPath(import.meta.url));
-export const root = path.resolve(dirname, "..");
-export const client = path.resolve(root, "dist/browser");
-export const ssr = path.resolve(root, "dist/server");
-export const cloudflare = path.resolve(root, "dist/cloudflare");
-export const worker = path.resolve(cloudflare, "_worker.js");