create-faas-app 8.0.0-beta.2 → 8.0.0-beta.20

package/README.md

@@ -1,20 +1,5 @@
 # create-faas-app
 
-[![License: MIT](https://img.shields.io/npm/l/create-faas-app.svg)](https://github.com/faasjs/faasjs/blob/main/packages/create-faas-app/LICENSE)
-[![NPM Version](https://img.shields.io/npm/v/create-faas-app.svg)](https://www.npmjs.com/package/create-faas-app)
-
-Quick way to create a FaasJS project.
-
-## Usage
-
-```bash
-# use npm
-npx create-faas-app --name faasjs
-
-# use bun
-bunx create-faas-app --name faasjs
-```
-
 ## Functions
 
 - [main](functions/main.md)

package/dist/index.d.ts

@@ -1,24 +1,19 @@
-import { Command } from 'commander';
+import { Command } from "commander";
 
+//#region src/index.d.ts
 /**
- * [![License: MIT](https://img.shields.io/npm/l/create-faas-app.svg)](https://github.com/faasjs/faasjs/blob/main/packages/create-faas-app/LICENSE)
- * [![NPM Version](https://img.shields.io/npm/v/create-faas-app.svg)](https://www.npmjs.com/package/create-faas-app)
+ * Run the `create-faas-app` CLI with a provided argv array.
  *
- * Quick way to create a FaasJS project.
+ * @param argv - CLI arguments forwarded to Commander.
+ * @returns Commander program instance after parsing.
  *
- * ## Usage
+ * @example
+ * ```ts
+ * import { main } from 'create-faas-app'
  *
- * ```bash
- * # use npm
- * npx create-faas-app --name faasjs
- *
- * # use bun
- * bunx create-faas-app --name faasjs
+ * await main(['node', 'create-faas-app', '--help'])
  * ```
- *
- * @packageDocumentation
  */
-
 declare function main(argv: string[]): Promise<Command>;
-
-export { main };
+//#endregion
+export { main };

package/dist/index.mjs

@@ -1,162 +1,118 @@
-import { Command } from 'commander';
-import { execSync } from 'child_process';
-import { mkdirSync, writeFileSync, existsSync } from 'fs';
-import { join } from 'path';
-import { prompt } from 'enquirer';
-
-// src/index.ts
-
-// package.json
-var package_default = {
-  version: "v8.0.0-beta.1"};
-var Validator = {
-  name(input) {
-    const match = /^[a-z0-9-_]+$/i.test(input) ? true : "Must be a-z, 0-9 or -_";
-    if (match !== true) return match;
-    if (existsSync(input))
-      return `${input} folder exists, please try another name`;
-    return true;
-  }
-};
-async function action(options = {}) {
-  const answers = Object.assign(options, {});
-  if (!options.name || Validator.name(options.name) !== true)
-    answers.name = await prompt({
-      type: "input",
-      name: "value",
-      message: "Project name",
-      initial: "faasjs",
-      validate: Validator.name
-    }).then((res) => res.value);
-  if (!answers.name) return;
-  mkdirSync(answers.name);
-  const runtime = process.versions.bun ? "bun" : "npm";
-  writeFileSync(
-    join(answers.name, "faas.yaml"),
-    `defaults:
-  plugins:
-development:
-testing:
-staging:
-production:
-`
-  );
-  writeFileSync(
-    join(answers.name, "package.json"),
-    `{
-  "name": "${answers.name}",
-  "version": "1.0.0",
-  "private": true,
-  "scripts": {
-    "serve": "faas server",
-    "test": "vitest run"
-  },
-  "dependencies": {
-    "faasjs": "*"
-  },
-  "devDependencies": {
-    "vitest": "*"
-  }
-}`
-  );
-  writeFileSync(
-    join(answers.name, "tsconfig.json"),
-    `{
-  "compilerOptions": {
-    "downlevelIteration": true,
-    "esModuleInterop": true,
-    "target": "ES2019",
-    "module": "ESNext",
-    "moduleResolution": "node",
-    "baseUrl": "."
-  }
+import { Command } from "commander";
+import { execSync } from "node:child_process";
+import { existsSync, mkdirSync, readFileSync, readdirSync, writeFileSync } from "node:fs";
+import { dirname, join } from "node:path";
+import { fileURLToPath } from "node:url";
+import enquirer from "enquirer";
+//#region package.json
+var version = "8.0.0-beta.19";
+//#endregion
+//#region src/action.ts
+const prompt = enquirer.prompt;
+const validateName = (input) => Validator.name(input);
+const templateRoot = join(dirname(fileURLToPath(import.meta.url)), "..", "template");
+const Validator = { name(input) {
+	const match = /^[a-z0-9-_]+$/i.test(input) ? true : "Must be a-z, 0-9 or -_";
+	if (match !== true) return match;
+	if (existsSync(input)) return `${input} folder exists, please try another name`;
+	return true;
+} };
+function getTemplateNames() {
+	return readdirSync(templateRoot, { withFileTypes: true }).filter((entry) => entry.isDirectory()).map((entry) => entry.name).sort();
 }
-`
-  );
-  writeFileSync(
-    join(answers.name, ".gitignore"),
-    `node_modules/
-tmp/
-coverage/
-*.tmp.js
-`
-  );
-  mkdirSync(join(answers.name, ".vscode"));
-  writeFileSync(
-    join(answers.name, ".vscode", "settings.json"),
-    `{
-  "editor.detectIndentation": true,
-  "editor.insertSpaces": true,
-  "editor.tabSize": 2,
-  "editor.codeActionsOnSave": {
-    "source.fixAll": true
-  },
-  "editor.wordWrap": "on",
-  "files.insertFinalNewline": true,
-  "files.trimFinalNewlines": true,
-  "files.trimTrailingWhitespace": true
+function resolveTemplateName(template = "basic") {
+	const templates = getTemplateNames();
+	if (templates.includes(template)) return template;
+	throw new Error(`Unknown template "${template}". Available templates: ${templates.join(", ")}`);
 }
-`
-  );
-  writeFileSync(
-    join(answers.name, ".vscode", "extensions.json"),
-    `{
-  "recommendations": [
-    "faasjs.faasjs-snippets"
-  ]
+function renderTemplate(content, replacements) {
+	return Object.entries(replacements).reduce((result, [key, value]) => result.replaceAll(`{{${key}}}`, value), content);
 }
-`
-  );
-  execSync(`cd ${answers.name} && ${runtime} install`, { stdio: "inherit" });
-  writeFileSync(
-    join(answers.name, "index.func.ts"),
-    `import { useFunc } from '@faasjs/func'
-import { useHttp } from '@faasjs/http'
-
-export const func = useFunc(() => {
-  const http = useHttp<{ name: string }>()
-
-  return async () => \`Hello, \${http.params.name}\`
-})
-`
-  );
-  mkdirSync(join(answers.name, "__tests__"));
-  writeFileSync(
-    join(answers.name, "__tests__", "index.test.ts"),
-    `import { test } from '@faasjs/test'
-import { func } from '../index.func'
-
-describe('hello', () => {
-  it('should work', async () => {
-    const testFunc = test(func)
-
-    const { statusCode, data } = await testFunc.JSONhandler<string>({ name: 'world' })
-
-    expect(statusCode).toEqual(200)
-    expect(data).toEqual('Hello, world')
-  })
-})
-`
-  );
-  if (runtime === "bun") {
-    execSync(`cd ${answers.name} && bun test`, { stdio: "inherit" });
-  } else execSync(`cd ${answers.name} && npm run test`, { stdio: "inherit" });
+function copyTemplateDirectory(sourcePath, targetPath, replacements) {
+	mkdirSync(targetPath, { recursive: true });
+	for (const entry of readdirSync(sourcePath, { withFileTypes: true })) {
+		const nextSourcePath = join(sourcePath, entry.name);
+		const nextTargetPath = join(targetPath, entry.name === "gitignore" ? ".gitignore" : entry.name);
+		if (entry.isDirectory()) {
+			copyTemplateDirectory(nextSourcePath, nextTargetPath, replacements);
+			continue;
+		}
+		writeFileSync(nextTargetPath, renderTemplate(readFileSync(nextSourcePath, "utf8"), replacements));
+	}
 }
-function action_default(program) {
-  program.description("Create a new faas app").on("--help", () => console.log("Examples:\nnpx create-faas-app")).option("--name <name>", "Project name").action(action);
+function scaffold(rootPath, replacements, templateName) {
+	mkdirSync(rootPath);
+	copyTemplateDirectory(join(templateRoot, templateName), rootPath, replacements);
+}
+async function action(options = {}) {
+	const templateName = resolveTemplateName(options.template);
+	const answers = Object.assign(options, {});
+	if (!options.name || Validator.name(options.name) !== true) answers.name = await prompt({
+		type: "input",
+		name: "value",
+		message: "Project name",
+		initial: "faasjs",
+		validate: validateName
+	}).then((res) => res.value);
+	if (!answers.name) return;
+	const runtime = process.versions.bun ? "bun" : "npm";
+	scaffold(answers.name, { name: answers.name }, templateName);
+	execSync(`cd ${answers.name} && ${runtime} install`, { stdio: "inherit" });
+	if (runtime === "bun") execSync(`cd ${answers.name} && bun test`, { stdio: "inherit" });
+	else execSync(`cd ${answers.name} && npm run test`, { stdio: "inherit" });
 }
+function action_default(program) {
+	program.description("Create a new faas app").on("--help", () => console.log(`Examples:
+npx create-faas-app --name faasjs
+npx create-faas-app --name faasjs-admin --template antd
 
-// src/index.ts
-var commander = new Command();
-commander.storeOptionsAsProperties(false).allowUnknownOption(true).version(package_default.version).name("create-faas-app").exitOverride();
+Templates:
+${getTemplateNames().join(", ")}`)).option("--name <name>", "Project name").option("--template <template>", "Template name", "basic").action(action);
+}
+//#endregion
+//#region src/index.ts
+/**
+* [![License: MIT](https://img.shields.io/npm/l/create-faas-app.svg)](https://github.com/faasjs/faasjs/blob/main/packages/create-faas-app/LICENSE)
+* [![NPM Version](https://img.shields.io/npm/v/create-faas-app.svg)](https://www.npmjs.com/package/create-faas-app)
+*
+* Quick way to create a FaasJS project.
+*
+* ## Usage
+*
+* ```bash
+* # use npm
+* npx create-faas-app --name faasjs
+* npx create-faas-app --name faasjs-admin --template antd
+*
+* # use bun
+* bunx create-faas-app --name faasjs
+* bunx create-faas-app --name faasjs-admin --template antd
+* ```
+*/
+const commander = new Command();
+commander.storeOptionsAsProperties(false).allowUnknownOption(true).version(version).name("create-faas-app").exitOverride();
 action_default(commander);
+/**
+* Run the `create-faas-app` CLI with a provided argv array.
+*
+* @param argv - CLI arguments forwarded to Commander.
+* @returns Commander program instance after parsing.
+*
+* @example
+* ```ts
+* import { main } from 'create-faas-app'
+*
+* await main(['node', 'create-faas-app', '--help'])
+* ```
+*/
 async function main(argv) {
-  try {
-    await commander.parseAsync(argv);
-  } catch (error) {
-    console.error(error);
-  }
-  return commander;
+	try {
+		await commander.parseAsync(argv);
+	} catch (error) {
+		if (typeof error === "object" && error !== null && "code" in error && error.code === "commander.helpDisplayed") return commander;
+		console.error(error);
+	}
+	return commander;
 }
-
+//#endregion
 export { main };

package/index.mjs

@@ -2,4 +2,4 @@
 
 import { main } from './dist/index.mjs'
 
-main(process.argv)
+await main(process.argv)

package/package.json

@@ -1,38 +1,35 @@
 {
   "name": "create-faas-app",
-  "version": "v8.0.0-beta.2",
-  "license": "MIT",
-  "type": "module",
-  "main": "dist/index.cjs",
-  "module": "dist/index.mjs",
-  "types": "dist/index.d.ts",
-  "bin": {
-    "create-faas-app": "index.mjs"
-  },
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs"
-    }
-  },
+  "version": "8.0.0-beta.20",
   "homepage": "https://faasjs.com/doc/create-faas-app",
+  "bugs": {
+    "url": "https://github.com/faasjs/faasjs/issues"
+  },
+  "license": "MIT",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/faasjs/faasjs.git",
     "directory": "packages/create-faas-app"
   },
-  "bugs": {
-    "url": "https://github.com/faasjs/faasjs/issues"
-  },
   "funding": "https://github.com/sponsors/faasjs",
-  "scripts": {
-    "build": "tsup-node src/index.ts --config ../../tsup.config.ts"
+  "bin": {
+    "create-faas-app": "index.mjs"
   },
   "files": [
     "dist",
-    "index.js"
+    "index.mjs",
+    "template"
   ],
+  "type": "module",
+  "main": "dist/index.mjs",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.mjs"
+    }
+  },
   "dependencies": {
     "commander": ">=14.0.0",
     "enquirer": "*"

package/template/antd/gitignore

@@ -0,0 +1,3 @@
+node_modules/
+dist/
+coverage/

package/template/antd/index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>FaasJS Ant Design App</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/template/antd/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "{{name}}",
+  "version": "1.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vp dev",
+    "build": "vp build",
+    "start": "node --import @faasjs/node-utils/register-hooks server.ts",
+    "test": "vp test"
+  },
+  "dependencies": {
+    "@faasjs/ant-design": "*",
+    "@faasjs/core": "*"
+  },
+  "devDependencies": {
+    "@faasjs/dev": "*"
+  },
+  "overrides": {
+    "vite": "npm:@voidzero-dev/vite-plus-core",
+    "vitest": "npm:@voidzero-dev/vite-plus-test"
+  },
+  "engines": {
+    "node": ">=24.0.0",
+    "npm": ">=11.0.0"
+  }
+}

package/template/antd/server.ts

@@ -0,0 +1,26 @@
+import { dirname, join } from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+import { Server, staticHandler } from '@faasjs/core'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+
+const publicHandler = staticHandler({
+  root: join(__dirname, 'public'),
+  notFound: false,
+})
+
+const distHandler = staticHandler({
+  root: join(__dirname, 'dist'),
+  notFound: 'index.html',
+})
+
+new Server(join(__dirname, 'src'), {
+  beforeHandle: async (req, res, ctx) => {
+    if (!req.url || req.method !== 'GET') return
+
+    await publicHandler(req, res, ctx)
+    await distHandler(req, res, ctx)
+  },
+}).listen()

package/template/antd/src/faas.yaml

@@ -0,0 +1,11 @@
+defaults:
+  server:
+    root: .
+    base: /
+  plugins:
+    http:
+      config:
+        cookie:
+          secure: false
+          session:
+            secret: secret

package/template/antd/src/main.tsx

@@ -0,0 +1,25 @@
+import { App } from '@faasjs/ant-design'
+import { createRoot } from 'react-dom/client'
+
+import HomePage from './pages/home'
+
+createRoot(document.getElementById('root') as HTMLElement).render(
+  <App
+    browserRouterProps={false}
+    configProviderProps={{
+      theme: {
+        token: {
+          borderRadius: 16,
+          colorPrimary: '#1677ff',
+        },
+      },
+    }}
+    faasConfigProviderProps={{
+      faasClientOptions: {
+        baseUrl: '/',
+      },
+    }}
+  >
+    <HomePage />
+  </App>,
+)

package/template/antd/src/pages/home/api/__tests__/hello.test.ts

@@ -0,0 +1,17 @@
+import { test } from '@faasjs/dev'
+import { describe, it, expect } from 'vitest'
+
+import { func } from '../hello.func'
+
+describe('pages/home/api/hello', () => {
+  it('should work', async () => {
+    const wrapped = test(func)
+
+    const { statusCode, data } = await wrapped.JSONhandler({ name: 'world' })
+
+    expect(statusCode).toEqual(200)
+    expect(data).toEqual({
+      message: 'Hello, world!',
+    })
+  })
+})

package/template/antd/src/pages/home/api/hello.func.ts

@@ -0,0 +1,12 @@
+import { defineApi, z } from '@faasjs/core'
+
+export const func = defineApi({
+  schema: z.object({
+    name: z.string().min(1).optional(),
+  }),
+  async handler({ params }) {
+    return {
+      message: `Hello, ${params.name || 'FaasJS'}!`,
+    }
+  },
+})

package/template/antd/src/pages/home/index.tsx

@@ -0,0 +1,79 @@
+import { faas, useApp } from '@faasjs/ant-design'
+import { Button, Card, Input, Space, Typography } from 'antd'
+import { useState } from 'react'
+
+type HelloResponse = {
+  message?: string
+}
+
+export default function HomePage() {
+  const app = useApp()
+  const [name, setName] = useState('FaasJS')
+  const [messageText, setMessageText] = useState('Click button to call API')
+  const [loading, setLoading] = useState(false)
+
+  const callApi = async () => {
+    setLoading(true)
+
+    try {
+      const response = await faas('/pages/home/api/hello', {
+        name: name.trim() || undefined,
+      })
+      const nextMessage = (response.data as HelloResponse | undefined)?.message || 'Empty response'
+
+      setMessageText(nextMessage)
+      app.message.success('API call succeeded')
+    } catch (error: unknown) {
+      const errorMessage = error instanceof Error ? error.message : 'Request failed'
+
+      setMessageText(errorMessage)
+      app.notification.error({
+        message: 'API call failed',
+        description: errorMessage,
+      })
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  return (
+    <div
+      style={{
+        minHeight: '100vh',
+        display: 'grid',
+        placeItems: 'center',
+        padding: 24,
+        background: 'linear-gradient(135deg, #f5f7fa 0%, #e4ecfb 100%)',
+      }}
+    >
+      <Card
+        style={{
+          width: '100%',
+          maxWidth: 560,
+          boxShadow: '0 20px 45px rgba(15, 23, 42, 0.08)',
+        }}
+      >
+        <Space direction="vertical" size="large" style={{ width: '100%' }}>
+          <div>
+            <Typography.Title level={2}>FaasJS Ant Design App</Typography.Title>
+            <Typography.Paragraph type="secondary">
+              Call a FaasJS API through the Ant Design app shell.
+            </Typography.Paragraph>
+          </div>
+
+          <Input
+            value={name}
+            onChange={(event) => setName(event.target.value)}
+            placeholder="What should the API greet?"
+          />
+
+          <Button type="primary" loading={loading} onClick={callApi}>
+            Call /pages/home/api/hello
+          </Button>
+
+          <Typography.Paragraph style={{ marginBottom: 0 }}>{messageText}</Typography.Paragraph>
+        </Space>
+      </Card>
+    </div>
+  )
+}

package/template/antd/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "@faasjs/types/tsconfig/build.json",
+  "include": ["src", "vite.config.ts", "server.ts"]
+}

package/template/antd/vite.config.ts

@@ -0,0 +1,6 @@
+import { viteConfig } from '@faasjs/dev'
+import { defineConfig } from 'vite-plus'
+
+export default defineConfig({
+  ...viteConfig,
+})

package/template/basic/gitignore

@@ -0,0 +1,3 @@
+node_modules/
+dist/
+coverage/

package/template/basic/index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>FaasJS App</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/template/basic/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "{{name}}",
+  "version": "1.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vp dev",
+    "build": "vp build",
+    "start": "node --import @faasjs/node-utils/register-hooks server.ts",
+    "test": "vp test"
+  },
+  "dependencies": {
+    "@faasjs/core": "*",
+    "@faasjs/react": "*"
+  },
+  "devDependencies": {
+    "@faasjs/dev": "*"
+  },
+  "overrides": {
+    "vite": "npm:@voidzero-dev/vite-plus-core",
+    "vitest": "npm:@voidzero-dev/vite-plus-test"
+  },
+  "engines": {
+    "node": ">=24.0.0",
+    "npm": ">=11.0.0"
+  }
+}

package/template/basic/server.ts

@@ -0,0 +1,26 @@
+import { dirname, join } from 'node:path'
+import { fileURLToPath } from 'node:url'
+
+import { Server, staticHandler } from '@faasjs/core'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+
+const publicHandler = staticHandler({
+  root: join(__dirname, 'public'),
+  notFound: false,
+})
+
+const distHandler = staticHandler({
+  root: join(__dirname, 'dist'),
+  notFound: 'index.html',
+})
+
+new Server(join(__dirname, 'src'), {
+  beforeHandle: async (req, res, ctx) => {
+    if (!req.url || req.method !== 'GET') return
+
+    await publicHandler(req, res, ctx)
+    await distHandler(req, res, ctx)
+  },
+}).listen()

package/template/basic/src/faas.yaml

@@ -0,0 +1,11 @@
+defaults:
+  server:
+    root: .
+    base: /
+  plugins:
+    http:
+      config:
+        cookie:
+          secure: false
+          session:
+            secret: secret

package/template/basic/src/main.tsx

@@ -0,0 +1,5 @@
+import { createRoot } from 'react-dom/client'
+
+import HomePage from './pages/home'
+
+createRoot(document.getElementById('root') as HTMLElement).render(<HomePage />)

package/template/basic/src/pages/home/api/__tests__/hello.test.ts

@@ -0,0 +1,17 @@
+import { test } from '@faasjs/dev'
+import { describe, it, expect } from 'vitest'
+
+import { func } from '../hello.func'
+
+describe('pages/home/api/hello', () => {
+  it('should work', async () => {
+    const wrapped = test(func)
+
+    const { statusCode, data } = await wrapped.JSONhandler({ name: 'world' })
+
+    expect(statusCode).toEqual(200)
+    expect(data).toEqual({
+      message: 'Hello, world!',
+    })
+  })
+})

package/template/basic/src/pages/home/api/hello.func.ts

@@ -0,0 +1,12 @@
+import { defineApi, z } from '@faasjs/core'
+
+export const func = defineApi({
+  schema: z.object({
+    name: z.string().min(1).optional(),
+  }),
+  async handler({ params }) {
+    return {
+      message: `Hello, ${params.name || 'FaasJS'}!`,
+    }
+  },
+})

package/template/basic/src/pages/home/index.tsx

@@ -0,0 +1,51 @@
+import { useState } from 'react'
+
+import { faas } from '../../react-client'
+
+type HelloResponse = {
+  message?: string
+}
+
+export default function HomePage() {
+  const [name, setName] = useState('FaasJS')
+  const [message, setMessage] = useState('Click button to call API')
+  const [loading, setLoading] = useState(false)
+
+  const callApi = async () => {
+    setLoading(true)
+
+    try {
+      const response = await faas('/pages/home/api/hello', {
+        name: name.trim() || undefined,
+      })
+
+      const data = response.data as HelloResponse | undefined
+
+      setMessage(data?.message || 'Empty response')
+    } catch (error: unknown) {
+      setMessage(error instanceof Error ? error.message : 'Request failed')
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  return (
+    <main style={{ margin: '5rem auto', maxWidth: 420, padding: 24 }}>
+      <h1>FaasJS App</h1>
+      <p>{message}</p>
+
+      <label style={{ display: 'block', marginBottom: 12 }}>
+        Name:
+        <input
+          style={{ marginLeft: 8 }}
+          value={name}
+          onChange={(event) => setName(event.target.value)}
+        />
+      </label>
+
+      <button type="button" onClick={callApi} disabled={loading}>
+        {loading ? 'Loading...' : 'Call /pages/home/api/hello'}
+      </button>
+    </main>
+  )
+}

package/template/basic/src/react-client.ts

@@ -0,0 +1,8 @@
+import { FaasReactClient } from '@faasjs/react'
+
+const client = FaasReactClient({
+  baseUrl: '/',
+})
+
+export const faas = client.faas
+export const useFaas = client.useFaas

package/template/basic/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "@faasjs/types/tsconfig/build.json",
+  "include": ["src", "vite.config.ts", "server.ts"]
+}

package/template/basic/vite.config.ts

@@ -0,0 +1,6 @@
+import { viteConfig } from '@faasjs/dev'
+import { defineConfig } from 'vite-plus'
+
+export default defineConfig({
+  ...viteConfig,
+})

package/dist/index.cjs

@@ -1,164 +0,0 @@
-'use strict';
-
-var commander$1 = require('commander');
-var child_process = require('child_process');
-var fs = require('fs');
-var path = require('path');
-var enquirer = require('enquirer');
-
-// src/index.ts
-
-// package.json
-var package_default = {
-  version: "v8.0.0-beta.1"};
-var Validator = {
-  name(input) {
-    const match = /^[a-z0-9-_]+$/i.test(input) ? true : "Must be a-z, 0-9 or -_";
-    if (match !== true) return match;
-    if (fs.existsSync(input))
-      return `${input} folder exists, please try another name`;
-    return true;
-  }
-};
-async function action(options = {}) {
-  const answers = Object.assign(options, {});
-  if (!options.name || Validator.name(options.name) !== true)
-    answers.name = await enquirer.prompt({
-      type: "input",
-      name: "value",
-      message: "Project name",
-      initial: "faasjs",
-      validate: Validator.name
-    }).then((res) => res.value);
-  if (!answers.name) return;
-  fs.mkdirSync(answers.name);
-  const runtime = process.versions.bun ? "bun" : "npm";
-  fs.writeFileSync(
-    path.join(answers.name, "faas.yaml"),
-    `defaults:
-  plugins:
-development:
-testing:
-staging:
-production:
-`
-  );
-  fs.writeFileSync(
-    path.join(answers.name, "package.json"),
-    `{
-  "name": "${answers.name}",
-  "version": "1.0.0",
-  "private": true,
-  "scripts": {
-    "serve": "faas server",
-    "test": "vitest run"
-  },
-  "dependencies": {
-    "faasjs": "*"
-  },
-  "devDependencies": {
-    "vitest": "*"
-  }
-}`
-  );
-  fs.writeFileSync(
-    path.join(answers.name, "tsconfig.json"),
-    `{
-  "compilerOptions": {
-    "downlevelIteration": true,
-    "esModuleInterop": true,
-    "target": "ES2019",
-    "module": "ESNext",
-    "moduleResolution": "node",
-    "baseUrl": "."
-  }
-}
-`
-  );
-  fs.writeFileSync(
-    path.join(answers.name, ".gitignore"),
-    `node_modules/
-tmp/
-coverage/
-*.tmp.js
-`
-  );
-  fs.mkdirSync(path.join(answers.name, ".vscode"));
-  fs.writeFileSync(
-    path.join(answers.name, ".vscode", "settings.json"),
-    `{
-  "editor.detectIndentation": true,
-  "editor.insertSpaces": true,
-  "editor.tabSize": 2,
-  "editor.codeActionsOnSave": {
-    "source.fixAll": true
-  },
-  "editor.wordWrap": "on",
-  "files.insertFinalNewline": true,
-  "files.trimFinalNewlines": true,
-  "files.trimTrailingWhitespace": true
-}
-`
-  );
-  fs.writeFileSync(
-    path.join(answers.name, ".vscode", "extensions.json"),
-    `{
-  "recommendations": [
-    "faasjs.faasjs-snippets"
-  ]
-}
-`
-  );
-  child_process.execSync(`cd ${answers.name} && ${runtime} install`, { stdio: "inherit" });
-  fs.writeFileSync(
-    path.join(answers.name, "index.func.ts"),
-    `import { useFunc } from '@faasjs/func'
-import { useHttp } from '@faasjs/http'
-
-export const func = useFunc(() => {
-  const http = useHttp<{ name: string }>()
-
-  return async () => \`Hello, \${http.params.name}\`
-})
-`
-  );
-  fs.mkdirSync(path.join(answers.name, "__tests__"));
-  fs.writeFileSync(
-    path.join(answers.name, "__tests__", "index.test.ts"),
-    `import { test } from '@faasjs/test'
-import { func } from '../index.func'
-
-describe('hello', () => {
-  it('should work', async () => {
-    const testFunc = test(func)
-
-    const { statusCode, data } = await testFunc.JSONhandler<string>({ name: 'world' })
-
-    expect(statusCode).toEqual(200)
-    expect(data).toEqual('Hello, world')
-  })
-})
-`
-  );
-  if (runtime === "bun") {
-    child_process.execSync(`cd ${answers.name} && bun test`, { stdio: "inherit" });
-  } else child_process.execSync(`cd ${answers.name} && npm run test`, { stdio: "inherit" });
-}
-function action_default(program) {
-  program.description("Create a new faas app").on("--help", () => console.log("Examples:\nnpx create-faas-app")).option("--name <name>", "Project name").action(action);
-}
-
-// src/index.ts
-var commander = new commander$1.Command();
-commander.storeOptionsAsProperties(false).allowUnknownOption(true).version(package_default.version).name("create-faas-app").exitOverride();
-action_default(commander);
-async function main(argv) {
-  try {
-    await commander.parseAsync(argv);
-  } catch (error) {
-    console.error(error);
-  }
-  return commander;
-}
-
-exports.main = main;