create-cloudflare 0.0.0-8ca9533f8 → 0.0.0-8cdabe23f

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-cloudflare",
-  "version": "0.0.0-8ca9533f8",
+  "version": "0.0.0-8cdabe23f",
   "description": "A CLI for creating and deploying new applications to Cloudflare.",
   "keywords": [
     "cloudflare",
@@ -30,7 +30,7 @@
     "@babel/parser": "^7.21.3",
     "@babel/types": "^7.21.4",
     "@clack/prompts": "^0.6.3",
-    "@cloudflare/workers-types": "^4.20241205.0",
+    "@cloudflare/workers-types": "^4.20250428.0",
     "@iarna/toml": "^3.0.0",
     "@types/command-exists": "^1.2.0",
     "@types/cross-spawn": "^6.0.2",
@@ -38,7 +38,7 @@
     "@types/degit": "^2.8.6",
     "@types/dns2": "^2.0.3",
     "@types/esprima": "^4.0.3",
-    "@types/node": "^18.19.59",
+    "@types/node": "^20.17.32",
     "@types/semver": "^7.5.1",
     "@types/which-pm-runs": "^1.0.0",
     "@types/yargs": "^17.0.22",
@@ -46,12 +46,13 @@
     "@typescript-eslint/parser": "^6.9.0",
     "chalk": "^5.2.0",
     "command-exists": "^1.2.9",
+    "comment-json": "^4.2.5",
     "cross-spawn": "^7.0.3",
     "deepmerge": "^4.3.1",
     "degit": "^2.8.4",
     "dns2": "^2.1.0",
     "dotenv": "^16.0.0",
-    "esbuild": "0.17.19",
+    "esbuild": "0.25.2",
     "execa": "^7.1.1",
     "glob": "^10.3.3",
     "haikunator": "^2.1.2",
@@ -59,23 +60,29 @@
     "magic-string": "^0.30.5",
     "open": "^8.4.0",
     "recast": "^0.22.0",
-    "semver": "^7.5.1",
-    "undici": "^5.28.4",
+    "semver": "^7.7.1",
+    "typescript": "^5.7.2",
+    "undici": "^5.28.5",
+    "vite": "^5.4.14",
     "vite-tsconfig-paths": "^4.0.8",
+    "vitest": "~3.1.1",
     "which-pm-runs": "^1.1.0",
     "wrap-ansi": "^9.0.0",
     "xdg-app-paths": "^8.3.0",
     "yargs": "^17.7.2",
-    "@cloudflare/eslint-config-worker": "1.1.0",
     "@cloudflare/cli": "1.1.1",
+    "@cloudflare/eslint-config-worker": "1.1.0",
     "@cloudflare/workers-tsconfig": "0.0.0",
-    "wrangler": "0.0.0-8ca9533f8"
+    "wrangler": "0.0.0-8cdabe23f",
+    "@cloudflare/vite-plugin": "0.0.0-8cdabe23f",
+    "@cloudflare/mock-npm-registry": "0.0.0"
   },
   "engines": {
     "node": ">=18.14.1"
   },
   "workers-sdk": {
-    "prerelease": true
+    "prerelease": true,
+    "type": "cli"
   },
   "volta": {
     "extends": "../../package.json"
@@ -92,7 +99,7 @@
     "test:e2e:yarn": "pnpm run build && cross-env TEST_PM=yarn vitest run --config ./vitest-e2e.config.mts",
     "test:unit": "vitest run --config ./vitest.config.mts",
     "test:unit:watch": "vitest --config ./vitest.config.mts",
-    "watch": "node -r esbuild-register scripts/build.ts --watch",
+    "dev": "node -r esbuild-register scripts/build.ts --watch",
     "test:ci": "vitest run --config ./vitest.config.mts"
   }
 }

package/templates/analog/templates/worker-configuration.d.ts

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

package/templates/analog/templates/wrangler.jsonc

@@ -0,0 +1,5 @@
+{
+  "name": "<TBD>",
+  "compatibility_date": "<TBD>",
+  "pages_build_output_dir": "./dist/analog/public"
+}

package/templates/angular/c3.ts

@@ -1,114 +1,9 @@
-import { resolve } from "node:path";
-import { logRaw } from "@cloudflare/cli";
-import { brandColor, dim } from "@cloudflare/cli/colors";
-import { spinner } from "@cloudflare/cli/interactive";
-import { runFrameworkGenerator } from "frameworks/index";
-import { compatDateFlag } from "helpers/compatDate";
-import { readFile, readJSON, writeFile } from "helpers/files";
-import { detectPackageManager } from "helpers/packageManagers";
-import { installPackages } from "helpers/packages";
-import type { TemplateConfig } from "../../src/templates";
-import type { C3Context } from "types";
+import pages from "./pages/c3";
+import workers from "./workers/c3";
+import type { MultiPlatformTemplateConfig } from "../../src/templates";
 
-const { npm } = detectPackageManager();
-
-const generate = async (ctx: C3Context) => {
-	await runFrameworkGenerator(ctx, [
-		ctx.project.name,
-		"--ssr",
-		"--server-routing" /** Dev Preview API */,
-	]);
-	logRaw("");
-};
-
-const configure = async (ctx: C3Context) => {
-	updateAngularJson(ctx);
-	await updateAppCode();
-	await installCFWorker();
-};
-
-async function installCFWorker() {
-	await installPackages(["xhr2"], {
-		dev: true,
-		startText: "Installing additional dependencies",
-		doneText: `${brandColor("installed")} ${dim(`via \`${npm} install\``)}`,
-	});
-}
-async function updateAppCode() {
-	const s = spinner();
-	s.start(`Updating application code`);
-
-	// Update an app config file to:
-	// - add the `provideHttpClient(withFetch())` call to enable `fetch` usage in `HttpClient`
-	const appConfigPath = "src/app/app.config.ts";
-	const appConfig = readFile(resolve(appConfigPath));
-	const newAppConfig =
-		"import { provideHttpClient, withFetch } from '@angular/common/http';\n" +
-		appConfig.replace(
-			"providers: [",
-			"providers: [provideHttpClient(withFetch()), ",
-		);
-	writeFile(resolve(appConfigPath), newAppConfig);
-	s.stop(`${brandColor(`updated`)} ${dim(appConfigPath)}`);
-
-	// Update an app server routes file to:
-	const appServerRoutesPath = "src/app/app.routes.server.ts";
-	const appRoutes = readFile(resolve(appServerRoutesPath));
-	const newAppRoutes = appRoutes.replace(
-		"RenderMode.Prerender",
-		"RenderMode.Server",
-	);
-	writeFile(resolve(appServerRoutesPath), newAppRoutes);
-	s.stop(`${brandColor(`updated`)} ${dim(appServerRoutesPath)}`);
-
-	// Remove unwanted dependencies
-	s.start(`Updating package.json`);
-	const packageJsonPath = resolve("package.json");
-	const packageManifest = readJSON(packageJsonPath);
-
-	delete packageManifest["dependencies"]["express"];
-	delete packageManifest["devDependencies"]["@types/express"];
-
-	writeFile(packageJsonPath, JSON.stringify(packageManifest, null, 2));
-	s.stop(`${brandColor(`updated`)} ${dim(`\`package.json\``)}`);
-}
-
-function updateAngularJson(ctx: C3Context) {
-	const s = spinner();
-	s.start(`Updating angular.json config`);
-	const angularJson = readJSON(resolve("angular.json"));
-	// Update builder
-	const architectSection = angularJson.projects[ctx.project.name].architect;
-	architectSection.build.options.outputPath = "dist";
-	architectSection.build.options.outputMode = "server";
-	architectSection.build.options.ssr.experimentalPlatform = "neutral";
-	architectSection.build.options.assets.push("src/_routes.json");
-
-	writeFile(resolve("angular.json"), JSON.stringify(angularJson, null, 2));
-	s.stop(`${brandColor(`updated`)} ${dim(`\`angular.json\``)}`);
-}
-
-const config: TemplateConfig = {
-	configVersion: 1,
-	id: "angular",
-	frameworkCli: "@angular/create",
+const config: MultiPlatformTemplateConfig = {
 	displayName: "Angular",
-	platform: "pages",
-	copyFiles: {
-		path: "./templates",
-	},
-	devScript: "start",
-	deployScript: "deploy",
-	previewScript: "start",
-	generate,
-	configure,
-	transformPackageJson: async () => ({
-		scripts: {
-			start: `${npm} run build && wrangler pages dev dist/cloudflare ${await compatDateFlag()}`,
-			build: `ng build && ${npm} run process`,
-			process: "node ./tools/copy-files.mjs",
-			deploy: `${npm} run build && wrangler pages deploy dist/cloudflare`,
-		},
-	}),
+	platformVariants: { pages, workers },
 };
 export default config;

package/templates/angular/pages/c3.ts

@@ -0,0 +1,135 @@
+import { resolve } from "node:path";
+import { logRaw } from "@cloudflare/cli";
+import { brandColor, dim } from "@cloudflare/cli/colors";
+import { spinner } from "@cloudflare/cli/interactive";
+import { runFrameworkGenerator } from "frameworks/index";
+import { compatDateFlag } from "helpers/compatDate";
+import { readFile, readJSON, writeFile } from "helpers/files";
+import { detectPackageManager } from "helpers/packageManagers";
+import { installPackages } from "helpers/packages";
+import type { TemplateConfig } from "../../../src/templates";
+import type { C3Context, PackageJson } from "types";
+
+const { npm } = detectPackageManager();
+
+const generate = async (ctx: C3Context) => {
+	await runFrameworkGenerator(ctx, [
+		ctx.project.name,
+		"--ssr",
+		"--server-routing" /** Dev Preview API */,
+	]);
+	logRaw("");
+};
+
+const configure = async (ctx: C3Context) => {
+	updateAngularJson(ctx);
+	await updateAppCode();
+	await installCFWorker();
+};
+
+async function installCFWorker() {
+	await installPackages(["xhr2"], {
+		dev: true,
+		startText: "Installing additional dependencies",
+		doneText: `${brandColor("installed")} ${dim(`via \`${npm} install\``)}`,
+	});
+}
+async function updateAppCode() {
+	const s = spinner();
+	s.start(`Updating application code`);
+
+	// Update an app config file to:
+	// - add the `provideHttpClient(withFetch())` call to enable `fetch` usage in `HttpClient`
+	const appConfigPath = "src/app/app.config.ts";
+	const appConfig = readFile(resolve(appConfigPath));
+	const newAppConfig =
+		"import { provideHttpClient, withFetch } from '@angular/common/http';\n" +
+		appConfig.replace(
+			"providers: [",
+			"providers: [provideHttpClient(withFetch()), ",
+		);
+	writeFile(resolve(appConfigPath), newAppConfig);
+	s.stop(`${brandColor(`updated`)} ${dim(appConfigPath)}`);
+
+	// Update an app server routes file to:
+	const appServerRoutesPath = "src/app/app.routes.server.ts";
+	const appRoutes = readFile(resolve(appServerRoutesPath));
+	const newAppRoutes = appRoutes.replace(
+		"RenderMode.Prerender",
+		"RenderMode.Server",
+	);
+	writeFile(resolve(appServerRoutesPath), newAppRoutes);
+	s.stop(`${brandColor(`updated`)} ${dim(appServerRoutesPath)}`);
+
+	// Remove unwanted dependencies
+	s.start(`Updating package.json`);
+	const packageJsonPath = resolve("package.json");
+	const packageManifest = readJSON(packageJsonPath) as PackageJson;
+
+	delete packageManifest["dependencies"]?.["express"];
+	delete packageManifest["devDependencies"]?.["@types/express"];
+
+	writeFile(packageJsonPath, JSON.stringify(packageManifest, null, 2));
+	s.stop(`${brandColor(`updated`)} ${dim(`\`package.json\``)}`);
+}
+
+function updateAngularJson(ctx: C3Context) {
+	const s = spinner();
+	s.start(`Updating angular.json config`);
+	const angularJson = readJSON("angular.json") as AngularJson;
+
+	// Update builder
+	const architectSection = angularJson.projects[ctx.project.name].architect;
+	architectSection.build.options.outputPath = "dist";
+	architectSection.build.options.outputMode = "server";
+	architectSection.build.options.ssr.experimentalPlatform = "neutral";
+	architectSection.build.options.assets.push("src/_routes.json");
+
+	writeFile(resolve("angular.json"), JSON.stringify(angularJson, null, 2));
+	s.stop(`${brandColor(`updated`)} ${dim(`\`angular.json\``)}`);
+}
+
+const config: TemplateConfig = {
+	configVersion: 1,
+	id: "angular",
+	frameworkCli: "@angular/create",
+	displayName: "Angular",
+	platform: "pages",
+	hidden: true,
+	copyFiles: {
+		path: "./templates",
+	},
+	path: "templates/angular/pages",
+	devScript: "start",
+	deployScript: "deploy",
+	previewScript: "start",
+	generate,
+	configure,
+	transformPackageJson: async () => ({
+		scripts: {
+			start: `${npm} run build && wrangler pages dev dist/cloudflare ${await compatDateFlag()}`,
+			build: `ng build && ${npm} run process`,
+			process: "node ./tools/copy-files.mjs",
+			deploy: `${npm} run build && wrangler pages deploy dist/cloudflare`,
+		},
+	}),
+};
+export default config;
+
+type AngularJson = {
+	projects: Record<
+		string,
+		{
+			architect: {
+				build: {
+					options: {
+						outputPath: string;
+						outputMode: string;
+						ssr: Record<string, unknown>;
+						assets: string[];
+					};
+				};
+			};
+		}
+	>;
+};

package/{templates-experimental/angular → templates/angular/workers}/c3.ts

@@ -6,8 +6,8 @@ import { runFrameworkGenerator } from "frameworks/index";
 import { readFile, readJSON, writeFile } from "helpers/files";
 import { detectPackageManager } from "helpers/packageManagers";
 import { installPackages } from "helpers/packages";
-import type { TemplateConfig } from "../../src/templates";
-import type { C3Context } from "types";
+import type { TemplateConfig } from "../../../src/templates";
+import type { C3Context, PackageJson } from "types";
 
 const { npm } = detectPackageManager();
 
@@ -63,10 +63,10 @@ async function updateAppCode() {
 	// Remove unwanted dependencies
 	s.start(`Updating package.json`);
 	const packageJsonPath = resolve("package.json");
-	const packageManifest = readJSON(packageJsonPath);
+	const packageManifest = readJSON(packageJsonPath) as PackageJson;
 
-	delete packageManifest["dependencies"]["express"];
-	delete packageManifest["devDependencies"]["@types/express"];
+	delete packageManifest["dependencies"]?.["express"];
+	delete packageManifest["devDependencies"]?.["@types/express"];
 
 	writeFile(packageJsonPath, JSON.stringify(packageManifest, null, 2));
 	s.stop(`${brandColor(`updated`)} ${dim(`\`package.json\``)}`);
@@ -75,7 +75,7 @@ async function updateAppCode() {
 function updateAngularJson(ctx: C3Context) {
 	const s = spinner();
 	s.start(`Updating angular.json config`);
-	const angularJson = readJSON(resolve("angular.json"));
+	const angularJson = readJSON(resolve("angular.json")) as AngularJson;
 	// Update builder
 	const architectSection = angularJson.projects[ctx.project.name].architect;
 	architectSection.build.options.outputPath = "dist";
@@ -95,7 +95,7 @@ const config: TemplateConfig = {
 	copyFiles: {
 		path: "./templates",
 	},
-	path: "templates-experimental/angular",
+	path: "templates/angular/workers",
 	devScript: "start",
 	deployScript: "deploy",
 	previewScript: "start",
@@ -110,3 +110,21 @@ const config: TemplateConfig = {
 	}),
 };
 export default config;
+
+type AngularJson = {
+	projects: Record<
+		string,
+		{
+			architect: {
+				build: {
+					options: {
+						outputPath: string;
+						outputMode: string;
+						ssr: Record<string, unknown>;
+						assets: string[];
+					};
+				};
+			};
+		}
+	>;
+};

package/templates/angular/workers/templates/wrangler.jsonc

@@ -0,0 +1,12 @@
+{
+  "name": "<TBD>",
+  "main": "./dist/server/server.mjs",
+  "compatibility_date": "<TBD>",
+  "assets": {
+    "binding": "ASSETS",
+    "directory": "./dist/browser"
+  },
+  "observability": {
+    "enabled": true
+  }
+}

package/templates/astro/c3.ts

@@ -1,113 +1,9 @@
-import { logRaw, updateStatus } from "@cloudflare/cli";
-import { blue, brandColor, dim } from "@cloudflare/cli/colors";
-import { runFrameworkGenerator } from "frameworks/index";
-import { loadTemplateSnippets, transformFile } from "helpers/codemod";
-import { runCommand } from "helpers/command";
-import { usesTypescript } from "helpers/files";
-import { detectPackageManager } from "helpers/packageManagers";
-import * as recast from "recast";
-import type { TemplateConfig } from "../../src/templates";
-import type { C3Context, PackageJson } from "types";
+import pages from "./pages/c3";
+import workers from "./workers/c3";
+import type { MultiPlatformTemplateConfig } from "../../src/templates";
 
-const { npx } = detectPackageManager();
-
-const generate = async (ctx: C3Context) => {
-	await runFrameworkGenerator(ctx, [ctx.project.name, "--no-install"]);
-
-	logRaw(""); // newline
-};
-
-const configure = async (ctx: C3Context) => {
-	await runCommand([npx, "astro", "add", "cloudflare", "-y"], {
-		silent: true,
-		startText: "Installing adapter",
-		doneText: `${brandColor("installed")} ${dim(
-			`via \`${npx} astro add cloudflare\``,
-		)}`,
-	});
-
-	updateAstroConfig();
-	updateEnvDeclaration(ctx);
-};
-
-const updateAstroConfig = () => {
-	const filePath = "astro.config.mjs";
-
-	updateStatus(`Updating configuration in ${blue(filePath)}`);
-
-	transformFile(filePath, {
-		visitCallExpression: function (n) {
-			const callee = n.node.callee as recast.types.namedTypes.Identifier;
-			if (callee.name !== "cloudflare") {
-				return this.traverse(n);
-			}
-
-			const b = recast.types.builders;
-			n.node.arguments = [
-				b.objectExpression([
-					b.objectProperty(
-						b.identifier("platformProxy"),
-						b.objectExpression([
-							b.objectProperty(b.identifier("enabled"), b.booleanLiteral(true)),
-						]),
-					),
-				]),
-			];
-
-			return false;
-		},
-	});
-};
-
-const updateEnvDeclaration = (ctx: C3Context) => {
-	if (!usesTypescript(ctx)) {
-		return;
-	}
-
-	const filePath = "src/env.d.ts";
-
-	updateStatus(`Adding type declarations in ${blue(filePath)}`);
-
-	transformFile(filePath, {
-		visitProgram: function (n) {
-			const snippets = loadTemplateSnippets(ctx);
-			const patch = snippets.runtimeDeclarationTs;
-			const b = recast.types.builders;
-
-			// Preserve comments with the new body
-			const comments = n.get("comments").value;
-			n.node.comments = comments.map((c: recast.types.namedTypes.CommentLine) =>
-				b.commentLine(c.value),
-			);
-
-			// Add the patch
-			n.get("body").push(...patch);
-
-			return false;
-		},
-	});
-};
-
-const config: TemplateConfig = {
-	configVersion: 1,
-	id: "astro",
-	frameworkCli: "create-astro",
-	platform: "pages",
+const config: MultiPlatformTemplateConfig = {
 	displayName: "Astro",
-	copyFiles: {
-		path: "./templates",
-	},
-	devScript: "dev",
-	deployScript: "deploy",
-	previewScript: "preview",
-	generate,
-	configure,
-	transformPackageJson: async (pkgJson: PackageJson, ctx: C3Context) => ({
-		scripts: {
-			deploy: `astro build && wrangler pages deploy`,
-			preview: `astro build && wrangler pages dev`,
-			...(usesTypescript(ctx) && { "cf-typegen": `wrangler types` }),
-		},
-	}),
+	platformVariants: { pages, workers },
 };
 export default config;

package/templates/astro/pages/c3.ts

@@ -0,0 +1,99 @@
+import { logRaw, updateStatus } from "@cloudflare/cli";
+import { blue, brandColor, dim } from "@cloudflare/cli/colors";
+import { runFrameworkGenerator } from "frameworks/index";
+import { transformFile } from "helpers/codemod";
+import { runCommand } from "helpers/command";
+import { usesTypescript } from "helpers/files";
+import { detectPackageManager } from "helpers/packageManagers";
+import * as recast from "recast";
+import type { TemplateConfig } from "../../../src/templates";
+import type { C3Context, PackageJson } from "types";
+
+const { npx } = detectPackageManager();
+
+const generate = async (ctx: C3Context) => {
+	await runFrameworkGenerator(ctx, [ctx.project.name, "--no-install"]);
+
+	logRaw(""); // newline
+};
+
+const configure = async () => {
+	await runCommand([npx, "astro", "add", "cloudflare", "-y"], {
+		silent: true,
+		startText: "Installing adapter",
+		doneText: `${brandColor("installed")} ${dim(
+			`via \`${npx} astro add cloudflare\``,
+		)}`,
+	});
+
+	updateAstroConfig();
+};
+
+const updateAstroConfig = () => {
+	const filePath = "astro.config.mjs";
+
+	updateStatus(`Updating configuration in ${blue(filePath)}`);
+
+	transformFile(filePath, {
+		visitCallExpression: function (n) {
+			const callee = n.node.callee as recast.types.namedTypes.Identifier;
+			if (callee.name !== "cloudflare") {
+				return this.traverse(n);
+			}
+
+			const b = recast.types.builders;
+			n.node.arguments = [
+				b.objectExpression([
+					b.objectProperty(
+						b.identifier("platformProxy"),
+						b.objectExpression([
+							b.objectProperty(b.identifier("enabled"), b.booleanLiteral(true)),
+						]),
+					),
+				]),
+			];
+
+			return false;
+		},
+	});
+};
+
+const config: TemplateConfig = {
+	configVersion: 1,
+	id: "astro",
+	frameworkCli: "create-astro",
+	platform: "pages",
+	hidden: true,
+	displayName: "Astro",
+	path: "templates/astro/pages",
+	copyFiles: {
+		async selectVariant(ctx) {
+			// Note: this `selectVariant` function should not be needed
+			//       this is just a quick workaround until
+			//       https://github.com/cloudflare/workers-sdk/issues/7495
+			//       is resolved
+			return usesTypescript(ctx) ? "ts" : "js";
+		},
+		variants: {
+			js: {
+				path: "./templates/js",
+			},
+			ts: {
+				path: "./templates/ts",
+			},
+		},
+	},
+	devScript: "dev",
+	deployScript: "deploy",
+	previewScript: "preview",
+	generate,
+	configure,
+	transformPackageJson: async (pkgJson: PackageJson, ctx: C3Context) => ({
+		scripts: {
+			deploy: `astro build && wrangler pages deploy`,
+			preview: `astro build && wrangler pages dev`,
+			...(usesTypescript(ctx) && { "cf-typegen": `wrangler types` }),
+		},
+	}),
+};
+export default config;

package/templates/astro/pages/templates/js/wrangler.jsonc

@@ -0,0 +1,8 @@
+{
+  "name": "<TBD>",
+  "compatibility_date": "<TBD>",
+  "compatibility_flags": [
+    "nodejs_compat"
+  ],
+  "pages_build_output_dir": "./dist"
+}

package/templates/astro/pages/templates/ts/worker-configuration.d.ts

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

package/templates/astro/pages/templates/ts/wrangler.jsonc

@@ -0,0 +1,8 @@
+{
+  "name": "<TBD>",
+  "compatibility_date": "<TBD>",
+  "compatibility_flags": [
+    "nodejs_compat"
+  ],
+  "pages_build_output_dir": "./dist"
+}