create-cloudflare 0.0.0-d55eeca8 → 0.0.0-d5ce0c459

package/templates/next/app/js/app/api/hello/route.js

@@ -1,9 +1,9 @@
-import { getRequestContext } from '@cloudflare/next-on-pages'
+// import { getRequestContext } from '@cloudflare/next-on-pages'
 
 export const runtime = 'edge'
 
-export async function GET(request) {
-  let responseText = 'Hello World'
+export async function GET() {
+  const responseText = 'Hello World'
 
   // In the edge runtime you can use Bindings that are available in your application
   // (for more details see:
@@ -15,7 +15,7 @@ export async function GET(request) {
   // const myKv = getRequestContext().env.MY_KV_NAMESPACE
   // await myKv.put('suffix', ' from a KV store!')
   // const suffix = await myKv.get('suffix')
-  // responseText += suffix
+  // return new Response(responseText + suffix)
 
   return new Response(responseText)
 }

package/templates/next/app/ts/app/api/hello/route.ts

@@ -1,10 +1,9 @@
-import type { NextRequest } from 'next/server'
-import { getRequestContext } from '@cloudflare/next-on-pages'
+// import { getRequestContext } from '@cloudflare/next-on-pages'
 
 export const runtime = 'edge'
 
-export async function GET(request: NextRequest) {
-  let responseText = 'Hello World'
+export async function GET() {
+  const responseText = 'Hello World'
 
   // In the edge runtime you can use Bindings that are available in your application
   // (for more details see:
@@ -16,7 +15,7 @@ export async function GET(request: NextRequest) {
   // const myKv = getRequestContext().env.MY_KV_NAMESPACE
   // await myKv.put('suffix', ' from a KV store!')
   // const suffix = await myKv.get('suffix')
-  // responseText += suffix
+  // return new Response(responseText + suffix)
 
   return new Response(responseText)
 }

package/templates/next/c3.ts

@@ -1,8 +1,7 @@
 import { join } from "path";
-import { crash, updateStatus, warn } from "@cloudflare/cli";
-import { processArgument } from "@cloudflare/cli/args";
+import { updateStatus, warn } from "@cloudflare/cli";
 import { brandColor, dim } from "@cloudflare/cli/colors";
-import { spinner } from "@cloudflare/cli/interactive";
+import { inputPrompt, spinner } from "@cloudflare/cli/interactive";
 import { runFrameworkGenerator } from "frameworks/index";
 import {
 	copyFile,
@@ -18,7 +17,7 @@ import { detectPackageManager } from "helpers/packageManagers";
 import { installPackages } from "helpers/packages";
 import { getTemplatePath } from "../../src/templates";
 import type { TemplateConfig } from "../../src/templates";
-import type { C3Args, C3Context } from "types";
+import type { C3Context } from "types";
 
 const { npm, npx } = detectPackageManager();
 
@@ -27,33 +26,15 @@ const generate = async (ctx: C3Context) => {
 
 	await runFrameworkGenerator(ctx, [projectName]);
 
-	const wranglerToml = readFile(join(getTemplatePath(ctx), "wrangler.toml"));
-
-	// Note: here we add `# KV Example:` to the toml file for the KV example, we don't actually
-	//       include the comment in the template wrangler.toml file just so to keep it identical
-	//       and consistent with that of all the other frameworks
-	//       (instead of making it a special case which needs extra care)
-	const newTomlContent = wranglerToml.replace(
-		/#\s+\[\[kv_namespaces\]\]\n#\s+binding\s+=\s+"MY_KV_NAMESPACE"\n#\s+id\s+=\s+"[a-zA-Z0-9]+?"/,
-		($1) => `# KV Example:\n${$1}`,
-	);
-
-	if (!/# KV Example/.test(newTomlContent)) {
-		// This should never happen to users, it is a check mostly so that
-		// if the toml file is changed in a way that breaks the "KV Example" addition
-		// the C3 Next.js e2e runs will fail with this
-		crash("Failed to properly generate the wrangler.toml file");
-	}
-
-	writeFile(join(ctx.project.path, "wrangler.toml"), newTomlContent);
-
-	updateStatus("Created wrangler.toml file");
+	const wranglerConfig = readFile(join(getTemplatePath(ctx), "wrangler.jsonc"));
+	writeFile(join(ctx.project.path, "wrangler.jsonc"), wranglerConfig);
+	updateStatus("Created wrangler.jsonc file");
 };
 
-const updateNextConfig = () => {
+const updateNextConfig = (usesTs: boolean) => {
 	const s = spinner();
 
-	const configFile = "next.config.mjs";
+	const configFile = `next.config.${usesTs ? "ts" : "mjs"}`;
 	s.start(`Updating \`${configFile}\``);
 
 	const configContent = readFile(configFile);
@@ -61,12 +42,12 @@ const updateNextConfig = () => {
 	const updatedConfigFile =
 		`import { setupDevPlatform } from '@cloudflare/next-on-pages/next-dev';
 
-		// Here we use the @cloudflare/next-on-pages next-dev module to allow us to use bindings during local development
-		// (when running the application with \`next dev\`), for more information see:
+		// Here we use the @cloudflare/next-on-pages next-dev module to allow us to
+		// use bindings during local development (when running the application with
+		// \`next dev\`). This function is only necessary during development and
+		// has no impact outside of that. For more information see:
 		// https://github.com/cloudflare/next-on-pages/blob/main/internal-packages/next-dev/README.md
-		if (process.env.NODE_ENV === 'development') {
-		  await setupDevPlatform();
-		}
+		setupDevPlatform().catch(console.error);
 
 		`.replace(/\n\t*/g, "\n") + configContent;
 
@@ -89,7 +70,7 @@ const configure = async (ctx: C3Context) => {
 	]);
 
 	if (!path) {
-		crash("Could not find the `/api` or `/app` directory");
+		throw new Error("Could not find the `/api` or `/app` directory");
 	}
 
 	const usesTs = usesTypescript(ctx);
@@ -108,7 +89,7 @@ const configure = async (ctx: C3Context) => {
 		await writeEslintrc(ctx);
 	}
 
-	updateNextConfig();
+	updateNextConfig(usesTs);
 
 	copyFile(
 		join(getTemplatePath(ctx), "README.md"),
@@ -135,7 +116,7 @@ export const shouldInstallNextOnPagesEslintPlugin = async (
 		return false;
 	}
 
-	return await processArgument(ctx.args, "eslint-plugin" as keyof C3Args, {
+	return await inputPrompt({
 		type: "confirm",
 		question: "Do you want to use the next-on-pages eslint-plugin?",
 		label: "eslint-plugin",
@@ -144,7 +125,10 @@ export const shouldInstallNextOnPagesEslintPlugin = async (
 };
 
 export const writeEslintrc = async (ctx: C3Context): Promise<void> => {
-	const eslintConfig = readJSON(`${ctx.project.path}/.eslintrc.json`);
+	const eslintConfig = readJSON(`${ctx.project.path}/.eslintrc.json`) as {
+		plugins: string[];
+		extends: string | string[];
+	};
 
 	eslintConfig.plugins ??= [];
 	eslintConfig.plugins.push("eslint-plugin-next-on-pages");
@@ -175,8 +159,9 @@ const addDevDependencies = async (installEslintPlugin: boolean) => {
 export default {
 	configVersion: 1,
 	id: "next",
+	frameworkCli: "create-next-app",
 	platform: "pages",
-	displayName: "Next",
+	displayName: "Next.js",
 	generate,
 	configure,
 	copyFiles: {

package/templates/next/wrangler.jsonc

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

package/templates/nuxt/c3.ts

@@ -1,133 +1,9 @@
-import { logRaw } from "@cloudflare/cli";
-import { brandColor, dim } from "@cloudflare/cli/colors";
-import { spinner } from "@cloudflare/cli/interactive";
-import { runFrameworkGenerator } from "frameworks/index";
-import { mergeObjectProperties, transformFile } from "helpers/codemod";
-import { getLatestTypesEntrypoint } from "helpers/compatDate";
-import { readFile, writeFile } from "helpers/files";
-import { detectPackageManager } from "helpers/packageManagers";
-import { installPackages } from "helpers/packages";
-import * as recast from "recast";
-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, name: pm } = detectPackageManager();
-
-const generate = async (ctx: C3Context) => {
-	const gitFlag = ctx.args.git ? `--gitInit` : `--no-gitInit`;
-
-	await runFrameworkGenerator(ctx, [
-		"init",
-		ctx.project.name,
-		"--packageManager",
-		npm,
-		gitFlag,
-	]);
-
-	writeFile("./.node-version", "17");
-
-	logRaw(""); // newline
-};
-
-const configure = async (ctx: C3Context) => {
-	const packages = ["nitro-cloudflare-dev"];
-
-	// When using pnpm, explicitly add h3 package so the H3Event type declaration can be updated.
-	// Package managers other than pnpm will hoist the dependency, as will pnpm with `--shamefully-hoist`
-	if (pm === "pnpm") {
-		packages.push("h3");
-	}
-
-	await installPackages(packages, {
-		dev: true,
-		startText: "Installing nitro module `nitro-cloudflare-dev`",
-		doneText: `${brandColor("installed")} ${dim(`via \`${npm} install\``)}`,
-	});
-	updateNuxtConfig();
-
-	updateEnvTypes(ctx);
-};
-
-const updateEnvTypes = (ctx: C3Context) => {
-	const filepath = "env.d.ts";
-
-	const s = spinner();
-	s.start(`Updating ${filepath}`);
-
-	let file = readFile(filepath);
-
-	let typesEntrypoint = `@cloudflare/workers-types`;
-	const latestEntrypoint = getLatestTypesEntrypoint(ctx);
-	if (latestEntrypoint) {
-		typesEntrypoint += `/${latestEntrypoint}`;
-	}
-
-	// Replace placeholder with actual types entrypoint
-	file = file.replace("WORKERS_TYPES_ENTRYPOINT", typesEntrypoint);
-	writeFile("env.d.ts", file);
-
-	s.stop(`${brandColor(`updated`)} ${dim(`\`${filepath}\``)}`);
-};
-
-const updateNuxtConfig = () => {
-	const s = spinner();
-
-	const configFile = "nuxt.config.ts";
-	s.start(`Updating \`${configFile}\``);
-
-	const b = recast.types.builders;
-
-	const presetDef = b.objectProperty(
-		b.identifier("nitro"),
-		b.objectExpression([
-			b.objectProperty(
-				b.identifier("preset"),
-				b.stringLiteral("cloudflare-pages"),
-			),
-		]),
-	);
-
-	const moduleDef = b.objectProperty(
-		b.identifier("modules"),
-		b.arrayExpression([b.stringLiteral("nitro-cloudflare-dev")]),
-	);
-
-	transformFile(configFile, {
-		visitCallExpression: function (n) {
-			const callee = n.node.callee as recast.types.namedTypes.Identifier;
-			if (callee.name === "defineNuxtConfig") {
-				mergeObjectProperties(
-					n.node.arguments[0] as recast.types.namedTypes.ObjectExpression,
-					[presetDef, moduleDef],
-				);
-			}
-
-			return this.traverse(n);
-		},
-	});
-
-	s.stop(`${brandColor(`updated`)} ${dim(`\`${configFile}\``)}`);
-};
-
-const config: TemplateConfig = {
-	configVersion: 1,
-	id: "nuxt",
-	platform: "pages",
+const config: MultiPlatformTemplateConfig = {
 	displayName: "Nuxt",
-	copyFiles: {
-		path: "./templates",
-	},
-	generate,
-	configure,
-	transformPackageJson: async () => ({
-		scripts: {
-			deploy: `${npm} run build && wrangler pages deploy`,
-			preview: `${npm} run build && wrangler pages dev`,
-			"cf-typegen": `wrangler types`,
-		},
-	}),
-	devScript: "dev",
-	deployScript: "deploy",
-	previewScript: "preview",
+	platformVariants: { pages, workers },
 };
 export default config;

package/templates/nuxt/pages/c3.ts

@@ -0,0 +1,145 @@
+import { logRaw } from "@cloudflare/cli";
+import { brandColor, dim } from "@cloudflare/cli/colors";
+import { spinner } from "@cloudflare/cli/interactive";
+import { runFrameworkGenerator } from "frameworks/index";
+import { mergeObjectProperties, transformFile } from "helpers/codemod";
+import { getLatestTypesEntrypoint } from "helpers/compatDate";
+import { readFile, writeFile } from "helpers/files";
+import { detectPackageManager } from "helpers/packageManagers";
+import { installPackages } from "helpers/packages";
+import * as recast from "recast";
+import type { TemplateConfig } from "../../../src/templates";
+import type { C3Context } from "types";
+
+const { npm, name: pm } = detectPackageManager();
+
+const generate = async (ctx: C3Context) => {
+	const gitFlag = ctx.args.git ? `--gitInit` : `--no-gitInit`;
+
+	await runFrameworkGenerator(ctx, [
+		"init",
+		ctx.project.name,
+		"--packageManager",
+		npm,
+		gitFlag,
+	]);
+
+	writeFile("./.node-version", "18");
+
+	logRaw(""); // newline
+};
+
+const configure = async (ctx: C3Context) => {
+	const packages = ["nitro-cloudflare-dev"];
+
+	// When using pnpm, explicitly add h3 package so the H3Event type declaration can be updated.
+	// Package managers other than pnpm will hoist the dependency, as will pnpm with `--shamefully-hoist`
+	if (pm === "pnpm") {
+		packages.push("h3");
+	}
+
+	await installPackages(packages, {
+		dev: true,
+		startText: "Installing nitro module `nitro-cloudflare-dev`",
+		doneText: `${brandColor("installed")} ${dim(`via \`${npm} install\``)}`,
+	});
+	updateNuxtConfig();
+
+	updateEnvTypes(ctx);
+};
+
+const updateEnvTypes = (ctx: C3Context) => {
+	const filepath = "env.d.ts";
+
+	const s = spinner();
+	s.start(`Updating ${filepath}`);
+
+	let file = readFile(filepath);
+
+	let typesEntrypoint = `@cloudflare/workers-types`;
+	const latestEntrypoint = getLatestTypesEntrypoint(ctx);
+	if (latestEntrypoint) {
+		typesEntrypoint += `/${latestEntrypoint}`;
+	}
+
+	// Replace placeholder with actual types entrypoint
+	file = file.replace("WORKERS_TYPES_ENTRYPOINT", typesEntrypoint);
+	writeFile("env.d.ts", file);
+
+	s.stop(`${brandColor(`updated`)} ${dim(`\`${filepath}\``)}`);
+};
+
+const updateNuxtConfig = () => {
+	const s = spinner();
+
+	const configFile = "nuxt.config.ts";
+	s.start(`Updating \`${configFile}\``);
+
+	const b = recast.types.builders;
+
+	const presetDef = b.objectProperty(
+		b.identifier("nitro"),
+		b.objectExpression([
+			b.objectProperty(
+				b.identifier("preset"),
+				b.stringLiteral("cloudflare-pages"),
+			),
+			b.objectProperty(
+				b.identifier("cloudflare"),
+				b.objectExpression([
+					b.objectProperty(
+						b.identifier("deployConfig"),
+						b.booleanLiteral(true),
+					),
+					b.objectProperty(b.identifier("nodeCompat"), b.booleanLiteral(true)),
+				]),
+			),
+		]),
+	);
+
+	const moduleDef = b.objectProperty(
+		b.identifier("modules"),
+		b.arrayExpression([b.stringLiteral("nitro-cloudflare-dev")]),
+	);
+
+	transformFile(configFile, {
+		visitCallExpression: function (n) {
+			const callee = n.node.callee as recast.types.namedTypes.Identifier;
+			if (callee.name === "defineNuxtConfig") {
+				mergeObjectProperties(
+					n.node.arguments[0] as recast.types.namedTypes.ObjectExpression,
+					[presetDef, moduleDef],
+				);
+			}
+
+			return this.traverse(n);
+		},
+	});
+
+	s.stop(`${brandColor(`updated`)} ${dim(`\`${configFile}\``)}`);
+};
+
+const config: TemplateConfig = {
+	configVersion: 1,
+	id: "nuxt",
+	frameworkCli: "nuxi",
+	platform: "pages",
+	displayName: "Nuxt",
+	copyFiles: {
+		path: "./templates",
+	},
+	path: "templates/nuxt/pages",
+	generate,
+	configure,
+	transformPackageJson: async () => ({
+		scripts: {
+			deploy: `${npm} run build && wrangler pages deploy`,
+			preview: `${npm} run build && wrangler pages dev`,
+			"cf-typegen": `wrangler types`,
+		},
+	}),
+	devScript: "dev",
+	deployScript: "deploy",
+	previewScript: "preview",
+};
+export default config;

package/templates/nuxt/pages/templates/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/nuxt/pages/templates/wrangler.jsonc

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

package/templates/nuxt/workers/c3.ts

@@ -0,0 +1,145 @@
+import { logRaw } from "@cloudflare/cli";
+import { brandColor, dim } from "@cloudflare/cli/colors";
+import { spinner } from "@cloudflare/cli/interactive";
+import { runFrameworkGenerator } from "frameworks/index";
+import { mergeObjectProperties, transformFile } from "helpers/codemod";
+import { getLatestTypesEntrypoint } from "helpers/compatDate";
+import { readFile, writeFile } from "helpers/files";
+import { detectPackageManager } from "helpers/packageManagers";
+import { installPackages } from "helpers/packages";
+import * as recast from "recast";
+import type { TemplateConfig } from "../../../src/templates";
+import type { C3Context } from "types";
+
+const { npm, name: pm } = detectPackageManager();
+
+const generate = async (ctx: C3Context) => {
+	const gitFlag = ctx.args.git ? `--gitInit` : `--no-gitInit`;
+
+	await runFrameworkGenerator(ctx, [
+		"init",
+		ctx.project.name,
+		"--packageManager",
+		npm,
+		gitFlag,
+	]);
+
+	writeFile("./.node-version", "18");
+
+	logRaw(""); // newline
+};
+
+const configure = async (ctx: C3Context) => {
+	const packages = ["nitro-cloudflare-dev", "nitropack"];
+
+	// When using pnpm, explicitly add h3 package so the H3Event type declaration can be updated.
+	// Package managers other than pnpm will hoist the dependency, as will pnpm with `--shamefully-hoist`
+	if (pm === "pnpm") {
+		packages.push("h3");
+	}
+
+	await installPackages(packages, {
+		dev: true,
+		startText: "Installing nitro module `nitro-cloudflare-dev`",
+		doneText: `${brandColor("installed")} ${dim(`via \`${npm} install\``)}`,
+	});
+	updateNuxtConfig();
+
+	updateEnvTypes(ctx);
+};
+
+const updateEnvTypes = (ctx: C3Context) => {
+	const filepath = "env.d.ts";
+
+	const s = spinner();
+	s.start(`Updating ${filepath}`);
+
+	let file = readFile(filepath);
+
+	let typesEntrypoint = `@cloudflare/workers-types`;
+	const latestEntrypoint = getLatestTypesEntrypoint(ctx);
+	if (latestEntrypoint) {
+		typesEntrypoint += `/${latestEntrypoint}`;
+	}
+
+	// Replace placeholder with actual types entrypoint
+	file = file.replace("WORKERS_TYPES_ENTRYPOINT", typesEntrypoint);
+	writeFile("env.d.ts", file);
+
+	s.stop(`${brandColor(`updated`)} ${dim(`\`${filepath}\``)}`);
+};
+
+const updateNuxtConfig = () => {
+	const s = spinner();
+
+	const configFile = "nuxt.config.ts";
+	s.start(`Updating \`${configFile}\``);
+
+	const b = recast.types.builders;
+
+	const presetDef = b.objectProperty(
+		b.identifier("nitro"),
+		b.objectExpression([
+			b.objectProperty(
+				b.identifier("preset"),
+				b.stringLiteral("cloudflare_module"),
+			),
+			b.objectProperty(
+				b.identifier("cloudflare"),
+				b.objectExpression([
+					b.objectProperty(
+						b.identifier("deployConfig"),
+						b.booleanLiteral(true),
+					),
+					b.objectProperty(b.identifier("nodeCompat"), b.booleanLiteral(true)),
+				]),
+			),
+		]),
+	);
+
+	const moduleDef = b.objectProperty(
+		b.identifier("modules"),
+		b.arrayExpression([b.stringLiteral("nitro-cloudflare-dev")]),
+	);
+
+	transformFile(configFile, {
+		visitCallExpression: function (n) {
+			const callee = n.node.callee as recast.types.namedTypes.Identifier;
+			if (callee.name === "defineNuxtConfig") {
+				mergeObjectProperties(
+					n.node.arguments[0] as recast.types.namedTypes.ObjectExpression,
+					[presetDef, moduleDef],
+				);
+			}
+
+			return this.traverse(n);
+		},
+	});
+
+	s.stop(`${brandColor(`updated`)} ${dim(`\`${configFile}\``)}`);
+};
+
+const config: TemplateConfig = {
+	configVersion: 1,
+	id: "nuxt",
+	frameworkCli: "nuxi",
+	platform: "workers",
+	displayName: "Nuxt",
+	copyFiles: {
+		path: "./templates",
+	},
+	path: "templates/nuxt/workers",
+	generate,
+	configure,
+	transformPackageJson: async () => ({
+		scripts: {
+			deploy: `${npm} run build && wrangler deploy`,
+			preview: `${npm} run build && wrangler dev`,
+			"cf-typegen": `wrangler types`,
+		},
+	}),
+	devScript: "dev",
+	deployScript: "deploy",
+	previewScript: "preview",
+};
+export default config;

package/templates/nuxt/workers/templates/env.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="WORKERS_TYPES_ENTRYPOINT" />
+
+declare module "h3" {
+  interface H3EventContext {
+    cf: CfProperties;
+    cloudflare: {
+      request: Request;
+      env: Env;
+      context: ExecutionContext;
+    };
+  }
+}
+
+export {};

package/templates/nuxt/workers/templates/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/nuxt/workers/templates/wrangler.jsonc

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

package/templates/openapi/c3.ts

@@ -2,6 +2,7 @@ export default {
 	configVersion: 1,
 	id: "openapi",
 	displayName: "API starter (OpenAPI compliant)",
+	description: "Get started building a basic API on Workers",
 	platform: "workers",
 	copyFiles: {
 		path: "./ts",

package/templates/openapi/ts/package.json

@@ -16,6 +16,6 @@
 	"devDependencies": {
 		"@types/node": "20.8.3",
 		"@types/service-worker-mock": "^2.0.1",
-		"wrangler": "^3.60.3"
+		"wrangler": "^3.101.0"
 	}
 }

package/templates/openapi/ts/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 {
 }