create-cloudflare 2.12.0 → 2.12.1

package/templates/qwik/c3.ts

@@ -1,13 +1,13 @@
-import { endSection } from "@cloudflare/cli";
+import { crash, endSection } from "@cloudflare/cli";
 import { brandColor } from "@cloudflare/cli/colors";
 import { spinner } from "@cloudflare/cli/interactive";
-import { parseTs, transformFile } from "helpers/codemod";
+import { loadTemplateSnippets, transformFile } from "helpers/codemod";
 import { runCommand, runFrameworkGenerator } from "helpers/command";
 import { usesTypescript } from "helpers/files";
 import { detectPackageManager } from "helpers/packages";
+import * as recast from "recast";
 import { quoteShellArgs } from "../../src/common";
 import type { TemplateConfig } from "../../src/templates";
-import type * as recast from "recast";
 import type { C3Context } from "types";
 
 const { npm, npx } = detectPackageManager();
@@ -23,6 +23,7 @@ const configure = async (ctx: C3Context) => {
 	await runCommand(cmd);
 
 	addBindingsProxy(ctx);
+	populateCloudflareEnv();
 };
 
 const addBindingsProxy = (ctx: C3Context) => {
@@ -35,43 +36,90 @@ const addBindingsProxy = (ctx: C3Context) => {
 	const s = spinner();
 	s.start("Updating `vite.config.ts`");
 
-	// Insert the env declaration after the last import (but before the rest of the body)
-	const envDeclaration = `
-let env = {};
-
-if(process.env.NODE_ENV === 'development') {
-  const { getPlatformProxy } = await import('wrangler');
-  const platformProxy = await getPlatformProxy();
-  env = platformProxy.env;
-}
-`;
+	const snippets = loadTemplateSnippets(ctx);
+	const b = recast.types.builders;
 
 	transformFile("vite.config.ts", {
+		// Insert the env declaration after the last import (but before the rest of the body)
 		visitProgram: function (n) {
 			const lastImportIndex = n.node.body.findLastIndex(
 				(t) => t.type === "ImportDeclaration"
 			);
-			n.get("body").insertAt(lastImportIndex + 1, envDeclaration);
+			const lastImport = n.get("body", lastImportIndex);
+			lastImport.insertAfter(...snippets.getPlatformProxyTs);
+
+			return this.traverse(n);
+		},
+		// Pass the `platform` object from the declaration to the `qwikCity` plugin
+		visitCallExpression: function (n) {
+			const callee = n.node.callee as recast.types.namedTypes.Identifier;
+			if (callee.name !== "qwikCity") {
+				return this.traverse(n);
+			}
+
+			// The config object passed to `qwikCity`
+			const configArgument = n.node.arguments[0] as
+				| recast.types.namedTypes.ObjectExpression
+				| undefined;
+
+			const platformPropery = b.objectProperty.from({
+				key: b.identifier("platform"),
+				value: b.identifier("platform"),
+				shorthand: true,
+			});
+
+			if (!configArgument) {
+				n.node.arguments = [b.objectExpression([platformPropery])];
+
+				return false;
+			}
+
+			if (configArgument.type !== "ObjectExpression") {
+				crash("Failed to update `vite.config.ts`");
+			}
+
+			// Add the `platform` object to the object
+			configArgument.properties.push(platformPropery);
 
 			return false;
 		},
 	});
 
-	// Populate the `qwikCity` plugin with the platform object containing the `env` defined above.
-	const platformObject = parseTs(`{ platform: { env } }`);
+	s.stop(`${brandColor("updated")} \`vite.config.ts\``);
+};
 
-	transformFile("vite.config.ts", {
-		visitCallExpression: function (n) {
-			const callee = n.node.callee as recast.types.namedTypes.Identifier;
-			if (callee.name === "qwikCity") {
-				n.node.arguments = [platformObject];
+const populateCloudflareEnv = () => {
+	const entrypointPath = "src/entry.cloudflare-pages.tsx";
+
+	const s = spinner();
+	s.start(`Updating \`${entrypointPath}\``);
+
+	transformFile(entrypointPath, {
+		visitTSInterfaceDeclaration: function (n) {
+			const b = recast.types.builders;
+			const id = n.node.id as recast.types.namedTypes.Identifier;
+			if (id.name !== "QwikCityPlatform") {
+				this.traverse(n);
 			}
 
-			this.traverse(n);
+			const newBody = [
+				["env", "Env"],
+				// Qwik doesn't supply `cf` to the platform object. Should they do so, uncomment this
+				// ["cf", "CfProperties"],
+			].map(([varName, type]) =>
+				b.tsPropertySignature(
+					b.identifier(varName),
+					b.tsTypeAnnotation(b.tsTypeReference(b.identifier(type)))
+				)
+			);
+
+			n.node.body.body = newBody;
+
+			return false;
 		},
 	});
 
-	s.stop(`${brandColor("updated")} \`vite.config.ts\``);
+	s.stop(`${brandColor("updated")} \`${entrypointPath}\``);
 };
 
 const config: TemplateConfig = {
@@ -89,6 +137,8 @@ const config: TemplateConfig = {
 	transformPackageJson: async () => ({
 		scripts: {
 			deploy: `${npm} run build && wrangler pages deploy ./dist`,
+			preview: `${npm} run build && wrangler pages dev ./dist`,
+			"build-cf-types": `wrangler types`,
 		},
 	}),
 };

package/templates/qwik/snippets/getPlatformProxy.ts

@@ -0,0 +1,6 @@
+let platform = {};
+
+if(process.env.NODE_ENV === 'development') {
+  const { getPlatformProxy } = await import('wrangler');
+  platform = await getPlatformProxy();
+}

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

@@ -0,0 +1,3 @@
+// Generated by Wrangler on Fri Feb 16 2024 15:52:18 GMT-0600 (Central Standard Time)
+// After adding bindings to `wrangler.toml`, regenerate this interface via `npm build-cf-types`
+interface Env {}