feat(scaffolding): add hosting config files for common providers

add configuration files for Vercel, Netlify, and Cloudflare Pages to simplify deployment and address CORS header issues in TutorialKit. This improves the setup experience by automating build commands and headers for common hosting providers, reducing manual configuration steps.

close #234

Author: RonithManikonda

_headers

@@ -0,0 +1,3 @@
+/*
+  Cross-Origin-Embedder-Policy: require-corp
+  Cross-Origin-Opener-Policy: same-origin

netlify.toml

@@ -0,0 +1,5 @@
+[[headers]]
+  for = "/*"
+  [headers.values]
+    Cross-Origin-Embedder-Policy = "require-corp"
+    Cross-Origin-Opener-Policy = "same-origin"

package.json

@@ -17,7 +17,8 @@
     "demo:build": "pnpm run build && pnpm run --filter=demo.tutorialkit.dev build",
     "lint": "eslint \"{packages,docs,extensions,integration}/**/*\"",
     "test": "pnpm run --stream --filter='@tutorialkit/*' test --run",
-    "test:e2e": "pnpm run --filter='./e2e' test"
+    "test:e2e": "pnpm run --filter='./e2e' test",
+    "postbuild": "cp _headers ./dist/"
   },
   "license": "MIT",
   "packageManager": "[email protected]",

packages/cli/src/commands/create/index.ts

@@ -107,6 +107,24 @@ async function _createTutorial(flags: CreateOptions): Promise<undefined> {
   const dest = await getTutorialDirectory(tutorialName, flags);
   const resolvedDest = path.resolve(process.cwd(), dest);
 
+  const providers = await prompts.multiselect({
+    message: 'Select hosting providers for automatic configuration (use space to select):',
+    options: [
+      { value: 'Vercel', label: 'Vercel' },
+      { value: 'Netlify', label: 'Netlify' },
+      { value: 'Cloudflare', label: 'Cloudflare' },
+    ],
+    initialValues: [],
+  });
+
+  assertNotCanceled(providers);
+  prompts.log.info(`Configuring for: ${providers.join(', ')}`);
+
+  await generateHostingConfig(resolvedDest, providers);
+
+  await copyTemplate(resolvedDest, flags);
+  updatePackageJson(resolvedDest, tutorialName, flags);
+
   prompts.log.info(`Scaffolding tutorial in ${chalk.blue(resolvedDest)}`);
 
   if (fs.existsSync(resolvedDest) && !flags.force) {
@@ -319,3 +337,40 @@ function verifyFlags(flags: CreateOptions) {
     throw new Error('Cannot start project without installing dependencies.');
   }
 }
+
+function generateHostingConfig(dest: string, providers: string[]) {
+  if (providers.includes('Vercel')) {
+    fs.writeFileSync(
+      path.join(dest, 'vercel.json'),
+      JSON.stringify(
+        {
+          headers: [{ source: '/(.*)', headers: [{ key: 'Access-Control-Allow-Origin', value: '*' }] }],
+        },
+        null,
+        2,
+      ),
+    );
+  }
+
+  if (providers.includes('Netlify')) {
+    fs.writeFileSync(
+      path.join(dest, 'netlify.toml'),
+      `[build]
+  publish = "build"
+  command = "npm run build"
+  
+[[headers]]
+  for = "/*"
+  [headers.values]
+    Access-Control-Allow-Origin = "*"`,
+    );
+  }
+
+  if (providers.includes('Cloudflare')) {
+    fs.writeFileSync(
+      path.join(dest, '_headers'),
+      `/*
+  Access-Control-Allow-Origin: *`,
+    );
+  }
+}

vercel.json

@@ -0,0 +1,17 @@
+{
+  "headers": [
+    {
+      "source": "/(.*)",
+      "headers": [
+        {
+          "key": "Cross-Origin-Embedder-Policy",
+          "value": "require-crop"
+        },
+        {
+          "key": "Cross-Origin-Embedder-Policy",
+          "value": "same-origin"
+        }
+      ]
+    }
+  ]
+}