exportc 0.0.2 → 0.0.4

package/README.md

@@ -13,15 +13,18 @@ cd export && npm install && cd ..
 
 # Start development (Wrangler starts automatically!)
 npm run dev
+
+# Deploy to Cloudflare Workers Sites
+npm run export
 ```
 
 ## Usage
 
-After initialization, import your server exports using the `export:/` prefix:
+After initialization, import your server exports using the `export/` prefix:
 
 ```typescript
 // In your Vite app
-import { hello, Counter } from "export:/";
+import { hello, Counter } from "export/";
 
 const message = await hello("World");  // "Hello, World!"
 
@@ -48,7 +51,7 @@ Deploy your exports to Cloudflare Workers.
 
 ## Vite Plugin
 
-The `exportPlugin` automatically starts Wrangler and transforms `export:/` imports:
+The `exportPlugin` automatically starts Wrangler and transforms `export/` imports:
 
 ```typescript
 // vite.config.ts
@@ -57,22 +60,22 @@ import { exportPlugin } from "exportc/vite";
 
 export default defineConfig({
   plugins: [
-    exportPlugin({
-      // Production Worker URL (required for production builds)
-      production: "https://my-api.workers.dev",
-
-      // Optional: customize dev server
-      // port: 8787,
-      // autoStart: true,  // Auto-start Wrangler (default: true)
-    }),
+    exportPlugin(),
+    // Production URL is auto-detected from export/package.json name
+    // Override with: exportPlugin({ production: "https://custom.workers.dev" })
   ],
 });
 ```
 
-When you run `npm run dev`, the plugin:
+**Development** (`npm run dev`):
 1. Automatically starts Wrangler dev server
 2. Waits for it to be ready
-3. Transforms `export:/` imports to point to the local server
+3. Transforms `export/` imports to `http://localhost:8787`
+
+**Production** (`npm run export`):
+1. Builds Vite app
+2. Deploys to Workers Sites (static assets + server exports)
+3. `export/` imports resolve to `https://{worker-name}.workers.dev`
 
 ## Project Structure
 
@@ -90,20 +93,26 @@ my-vite-app/
 
 ## TypeScript Support
 
-The `export-env.d.ts` file provides type declarations for `export:/` imports. Update it when you add new exports:
+The `export-env.d.ts` file is **automatically generated** when you run `npm run dev`. The Vite plugin watches for changes to your export files and regenerates type declarations automatically.
 
 ```typescript
-// export-env.d.ts
-declare module "export:/" {
+// export-env.d.ts (auto-generated)
+declare module "export/" {
   export function hello(name: string): Promise<string>;
-  export function myNewFunction(): Promise<void>;
+  export class Counter {
+    constructor(initial?: number);
+    increment(): Promise<number>;
+    [Symbol.dispose](): Promise<void>;
+  }
 }
 
-declare module "export:/utils" {
+declare module "export/utils" {
   export function formatDate(date: Date): Promise<string>;
 }
 ```
 
+Types are inferred from your actual export code, so you get accurate type information with zero manual maintenance.
+
 ## License
 
 MIT

package/commands/deploy.js

@@ -23,27 +23,54 @@ export async function deploy(argv) {
 
   p.intro(pc.bgCyan(pc.black(" exportc deploy ")));
 
-  const s = p.spinner();
-  s.start("Deploying to Cloudflare Workers...");
+  // Step 1: Build Vite
+  const s1 = p.spinner();
+  s1.start("Building with Vite...");
 
-  // Run deploy
-  const deployProcess = spawn("npm", ["run", "deploy"], {
+  const viteBuild = spawn("npm", ["run", "build"], {
+    cwd,
+    stdio: ["ignore", "pipe", "pipe"],
+    shell: true,
+  });
+
+  let viteBuildOutput = "";
+  viteBuild.stdout.on("data", (data) => { viteBuildOutput += data.toString(); });
+  viteBuild.stderr.on("data", (data) => { viteBuildOutput += data.toString(); });
+
+  const viteExitCode = await new Promise((resolve) => {
+    viteBuild.on("close", resolve);
+    viteBuild.on("error", () => resolve(1));
+  });
+
+  if (viteExitCode !== 0) {
+    s1.stop("Vite build failed");
+    console.error(viteBuildOutput);
+    process.exit(1);
+  }
+
+  s1.stop("Vite build complete");
+
+  // Step 2: Deploy to Cloudflare Workers
+  const s2 = p.spinner();
+  s2.start("Deploying to Cloudflare Workers...");
+
+  const wranglerDeploy = spawn("npm", ["run", "deploy"], {
     cwd: exportDir,
     stdio: "inherit",
     shell: true,
   });
 
-  const exitCode = await new Promise((resolve) => {
-    deployProcess.on("close", resolve);
-    deployProcess.on("error", () => resolve(1));
+  const wranglerExitCode = await new Promise((resolve) => {
+    wranglerDeploy.on("close", resolve);
+    wranglerDeploy.on("error", () => resolve(1));
   });
 
-  if (exitCode !== 0) {
-    s.stop("Deployment failed");
+  if (wranglerExitCode !== 0) {
+    s2.stop("Deployment failed");
     process.exit(1);
   }
 
-  s.stop("Deployed successfully!");
+  s2.stop("Deployed successfully!");
 
   // Read worker name from export/package.json
   const exportPkgPath = path.join(exportDir, "package.json");
@@ -51,13 +78,16 @@ export async function deploy(argv) {
   const workerName = exportPkg.name;
 
   p.note(
-    `Your exports are now live at:
+    `Your app is now live at:
 ${pc.cyan(`https://${workerName}.workers.dev/`)}
 
-${pc.bold("Update your Vite config for production:")}
-${pc.dim("// vite.config.ts")}
-${pc.cyan(`exportPlugin({ production: "https://${workerName}.workers.dev" })`)}`,
-    "Deployed"
+${pc.bold("What was deployed:")}
+- Static assets (Vite build output)
+- Server exports (export/ directory)
+
+${pc.bold("Client imports will resolve to:")}
+${pc.cyan(`https://${workerName}.workers.dev/`)}`,
+    "Workers Sites"
   );
 
   p.outro("Done!");

package/commands/dev.js

@@ -45,7 +45,7 @@ export async function dev(argv) {
     `Wrangler dev server is running at ${pc.cyan("http://localhost:8787")}
 
 ${pc.bold("In your Vite app:")}
-${pc.cyan(`import { hello } from "export:/";`)}
+${pc.cyan(`import { hello } from "export/";`)}
 ${pc.cyan(`const message = await hello("World");`)}
 
 ${pc.dim("Press Ctrl+C to stop")}`,

package/commands/init.js

@@ -76,7 +76,7 @@ export async function init(argv) {
   if (!fs.existsSync(indexPath)) {
     const template = isTypeScript
       ? `// Server-side exports - these will be available to your client code
-// Import from "export:/" in your client code
+// Import from "export/" in your client code
 
 export async function hello(name: string): Promise<string> {
   return \`Hello, \${name}!\`;
@@ -103,7 +103,7 @@ export class Counter {
 }
 `
       : `// Server-side exports - these will be available to your client code
-// Import from "export:/" in your client code
+// Import from "export/" in your client code
 
 export async function hello(name) {
   return \`Hello, \${name}!\`;
@@ -132,6 +132,15 @@ export class Counter {
     fs.writeFileSync(indexPath, template);
   }
 
+  // Detect Vite build output directory from vite.config
+  let viteBuildOutDir = "dist"; // default
+  const viteConfigPath = path.join(cwd, viteConfig);
+  let viteConfigContent = fs.readFileSync(viteConfigPath, "utf8");
+  const outDirMatch = viteConfigContent.match(/outDir:\s*['"]([^'"]+)['"]/);
+  if (outDirMatch) {
+    viteBuildOutDir = outDirMatch[1];
+  }
+
   // Create export/package.json
   const exportPkgPath = path.join(exportDir, "package.json");
   const exportPkg = {
@@ -139,6 +148,7 @@ export class Counter {
     private: true,
     type: "module",
     exports: "./",
+    main: `../${viteBuildOutDir}`, // Static assets from Vite build
     scripts: {
       dev: "generate-export-types && wrangler dev",
       deploy: "generate-export-types && wrangler deploy",
@@ -160,25 +170,20 @@ export class Counter {
   // Update main package.json
   pkg.scripts = pkg.scripts || {};
 
-  // Add deploy script for export
-  if (!pkg.scripts["deploy"]) {
-    pkg.scripts["deploy"] = "cd export && npm run deploy";
-  } else if (!pkg.scripts["deploy"].includes("export")) {
-    // Add export deploy to existing deploy script
-    pkg.scripts["deploy:export"] = "cd export && npm run deploy";
+  // Add export script: build + deploy as Workers Sites
+  if (!pkg.scripts["export"]) {
+    pkg.scripts["export"] = "vite build && cd export && npm run deploy";
   }
 
   // Add exportc to devDependencies
   pkg.devDependencies = pkg.devDependencies || {};
   if (!pkg.devDependencies.exportc) {
-    pkg.devDependencies.exportc = "^0.0.1";
+    pkg.devDependencies.exportc = "^0.0.2";
   }
 
   fs.writeFileSync(pkgPath, JSON.stringify(pkg, null, 2) + "\n");
 
   // Update vite.config
-  const viteConfigPath = path.join(cwd, viteConfig);
-  let viteConfigContent = fs.readFileSync(viteConfigPath, "utf8");
 
   // Check if export plugin is already added
   if (!viteConfigContent.includes("exportc/vite")) {
@@ -232,13 +237,13 @@ wrangler.toml
   if (isTypeScript) {
     const envDtsPath = path.join(cwd, "export-env.d.ts");
     if (!fs.existsSync(envDtsPath)) {
-      const envDtsContent = `// Type declarations for export:/ imports
+      const envDtsContent = `// Type declarations for export/ imports
 // This file is auto-generated by exportc. You can modify it to add custom types.
 
 // Re-export types from your export directory
 // Update this when you add new exports
 
-declare module "export:/" {
+declare module "export/" {
   export function hello(name: string): Promise<string>;
   export function add(a: number, b: number): Promise<number>;
   export class Counter {
@@ -250,7 +255,7 @@ declare module "export:/" {
 }
 
 // Add more module declarations for subpaths:
-// declare module "export:/utils" {
+// declare module "export/utils" {
 //   export function myUtil(): Promise<void>;
 // }
 `;
@@ -284,7 +289,7 @@ declare module "export:/" {
 ├── package.json    ${pc.dim("# Worker configuration")}
 └── .gitignore
 
-${pc.cyan("export-env.d.ts")}     ${pc.dim("# Type declarations for export:/ imports")}`
+${pc.cyan("export-env.d.ts")}     ${pc.dim("# Type declarations for export/ imports")}`
     : `${pc.cyan("export/")}
 ├── index.${ext}        ${pc.dim("# Your server exports")}
 ├── package.json    ${pc.dim("# Worker configuration")}
@@ -302,11 +307,12 @@ ${pc.bold("Next steps:")}
    ${pc.cyan("npm run dev")}
 
 3. Import in your client code:
-   ${pc.cyan(`import { hello } from "export:/";`)}
+   ${pc.cyan(`import { hello } from "export/";`)}
    ${pc.cyan(`const message = await hello("World");`)}
 
-4. Deploy to Cloudflare:
-   ${pc.cyan("npm run deploy")}`,
+4. Deploy to Cloudflare Workers Sites:
+   ${pc.cyan("npm run export")}
+   ${pc.dim("# Builds Vite + deploys everything to Workers")}`,
     "Created"
   );
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "exportc",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "description": "CLI to add export to existing projects",
   "scripts": {
     "test": "node --test test/*.test.mjs"

package/vite-plugin.d.ts

@@ -37,11 +37,11 @@ export interface ExportPluginOptions {
  * Vite plugin for export integration
  *
  * Automatically starts Wrangler when you run `npm run dev` and allows
- * importing server exports using the "export:/" prefix:
+ * importing server exports using the "export/" prefix:
  *
  * ```ts
- * import { hello } from "export:/";
- * import { utils } from "export:/utils";
+ * import { hello } from "export/";
+ * import { utils } from "export/utils";
  * ```
  *
  * @example

package/vite-plugin.js

@@ -1,9 +1,9 @@
 /**
  * Vite plugin for export integration
  *
- * Allows importing server exports using the "export:/" prefix:
- *   import { hello } from "export:/";
- *   import { utils } from "export:/utils";
+ * Allows importing server exports using the "export/" prefix:
+ *   import { hello } from "export/";
+ *   import { utils } from "export/utils";
  *
  * In development:
  *   - Automatically starts Wrangler dev server
@@ -14,16 +14,16 @@
  */
 
 import { spawn } from "node:child_process";
-import { existsSync } from "node:fs";
+import { existsSync, readFileSync, writeFileSync, watchFile, unwatchFile } from "node:fs";
 import { resolve } from "node:path";
 
-const EXPORT_PREFIX = "export:";
+const EXPORT_PREFIX = "export/";
 const DEFAULT_DEV_PORT = 8787;
 
 /**
  * @param {Object} options
  * @param {string} [options.dev] - Development server URL (default: http://localhost:8787)
- * @param {string} [options.production] - Production Worker URL (required for production builds)
+ * @param {string} [options.production] - Production Worker URL (auto-detected from export/package.json name if not specified)
  * @param {string} [options.exportDir] - Export directory (default: ./export)
  * @param {boolean} [options.autoStart] - Auto-start Wrangler in dev mode (default: true)
  * @returns {import('vite').Plugin}
@@ -31,7 +31,7 @@ const DEFAULT_DEV_PORT = 8787;
 export function exportPlugin(options = {}) {
   const devPort = options.port || DEFAULT_DEV_PORT;
   const devUrl = options.dev || `http://localhost:${devPort}`;
-  const prodUrl = options.production;
+  let prodUrl = options.production;
   const exportDir = options.exportDir || "./export";
   const autoStart = options.autoStart !== false;
 
@@ -40,6 +40,59 @@ export function exportPlugin(options = {}) {
   let wranglerReady = false;
   let wranglerReadyPromise = null;
 
+  // Auto-detect production URL from export/package.json
+  const detectProductionUrl = (root) => {
+    if (prodUrl) return prodUrl;
+    try {
+      const exportPkgPath = resolve(root, exportDir, "package.json");
+      if (existsSync(exportPkgPath)) {
+        const exportPkg = JSON.parse(readFileSync(exportPkgPath, "utf8"));
+        if (exportPkg.name) {
+          return `https://${exportPkg.name}.workers.dev`;
+        }
+      }
+    } catch {}
+    return null;
+  };
+
+  // Generate export-env.d.ts from .export-types.js
+  const generateTypeDeclarations = (root) => {
+    try {
+      const typesFilePath = resolve(root, exportDir, ".export-types.js");
+      if (!existsSync(typesFilePath)) return;
+
+      const typesContent = readFileSync(typesFilePath, "utf8");
+      // Extract the first line which contains the default export
+      const firstLine = typesContent.split('\n')[0];
+      if (!firstLine.startsWith('export default ')) return;
+
+      // Remove "export default " prefix and trailing ";"
+      const jsonStr = firstLine.slice('export default '.length).replace(/;$/, '');
+
+      // Parse the types map
+      const typesMap = JSON.parse(jsonStr);
+
+      // Generate declare module statements
+      const declarations = ['// Auto-generated by exportc. Do not edit manually.', '// Re-run "npm run dev" to regenerate after changing export/ files.', ''];
+
+      for (const [route, types] of Object.entries(typesMap)) {
+        const modulePath = route === "" ? "export/" : `export/${route}`;
+        declarations.push(`declare module "${modulePath}" {`);
+        // Indent the type declarations
+        const indented = types.split('\n').map(line => line ? `  ${line}` : '').join('\n');
+        declarations.push(indented);
+        declarations.push('}');
+        declarations.push('');
+      }
+
+      const envDtsPath = resolve(root, "export-env.d.ts");
+      writeFileSync(envDtsPath, declarations.join('\n'));
+      console.log(`[exportc] Generated type declarations: export-env.d.ts`);
+    } catch (err) {
+      console.warn(`[exportc] Failed to generate type declarations:`, err.message);
+    }
+  };
+
   const startWrangler = (root) => {
     const exportPath = resolve(root, exportDir);
 
@@ -136,6 +189,11 @@ export function exportPlugin(options = {}) {
 
     config(config, { command }) {
       isDev = command === "serve";
+      // Auto-detect production URL if not specified
+      if (!isDev && !prodUrl) {
+        const root = config.root || process.cwd();
+        prodUrl = detectProductionUrl(root);
+      }
       return {};
     },
 
@@ -144,8 +202,27 @@ export function exportPlugin(options = {}) {
         const root = server.config.root || process.cwd();
         wranglerReadyPromise = startWrangler(root);
 
+        // Generate types after Wrangler is ready
+        wranglerReadyPromise.then(() => {
+          // Initial generation
+          setTimeout(() => generateTypeDeclarations(root), 1000);
+
+          // Watch for changes to .export-types.js
+          const typesFilePath = resolve(root, exportDir, ".export-types.js");
+          if (existsSync(typesFilePath)) {
+            watchFile(typesFilePath, { interval: 1000 }, () => {
+              generateTypeDeclarations(root);
+            });
+          }
+        });
+
         // Cleanup on server close
-        server.httpServer?.on("close", stopWrangler);
+        server.httpServer?.on("close", () => {
+          stopWrangler();
+          // Stop watching
+          const typesFilePath = resolve(root, exportDir, ".export-types.js");
+          unwatchFile(typesFilePath);
+        });
       }
     },
 
@@ -213,7 +290,7 @@ export { default } from "${fullUrl}";
         return null;
       }
 
-      if (code.includes('import("export:') || code.includes("import('export:")) {
+      if (code.includes('import("export/') || code.includes("import('export/")) {
         const baseUrl = isDev ? devUrl : prodUrl;
         if (!baseUrl && !isDev) {
           this.warn(`[exportc] Production URL not configured for dynamic imports in ${id}`);
@@ -221,7 +298,7 @@ export { default } from "${fullUrl}";
         }
 
         const transformed = code.replace(
-          /import\((['"])export:([^'"]*)\1\)/g,
+          /import\((['"])export\/([^'"]*)\1\)/g,
           (match, quote, path) => {
             const fullUrl = new URL(path || "/", baseUrl).href;
             return `import(${quote}${fullUrl}${quote})`;