sveltekit-python-vercel 0.1.0

package/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 SemiCognitive
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,191 @@
+<img width="100" alt="image" src="https://user-images.githubusercontent.com/20548516/218344678-d41f4c4a-6b1b-48cc-8553-2b9fbe2169d6.png"/>
+<img width="100" alt="image" src="https://camo.githubusercontent.com/f1ac9955f30176e6183aeeeac1b77354c7a132696fdc77c06ef0f0bec30f258c/68747470733a2f2f6861636b616461792e636f6d2f77702d636f6e74656e742f75706c6f6164732f323031392f30392f707974686f6e2d6c6f676f2e706e67"/>
+<img width="100" alt="image" src="https://camo.githubusercontent.com/add2c9721e333f0043ac938f3dadbc26a282776e01b95b308fcaba5afaf74ae3/68747470733a2f2f6173736574732e76657263656c2e636f6d2f696d6167652f75706c6f61642f76313538383830353835382f7265706f7369746f726965732f76657263656c2f6c6f676f2e706e67"/>
+
+# sveltekit-python-vercel
+
+Write Python endpoints in [SvelteKit](https://kit.svelte.dev/) and seamlessly deploy them to Vercel.
+
+**This is very much in beta.**
+
+## Current Features
+
+- Write `+server.py` files nearly the same way you would write `+server.js` files
+- These functions deploy automatically to Vercel Serverless
+
+## Installing
+
+- Open or set up your SvelteKit project
+- Install with `npm i -D sveltekit-python-vercel`
+- Update your `vite.config.js`
+
+  ```javascript
+  import { defineConfig } from "vite";
+  import { sveltekit } from "@sveltejs/kit/vite";
+  import { sveltekit_python_vercel } from "sveltekit-python-vercel/vite";
+
+  export default defineConfig(({ command, mode }) => {
+    return {
+      plugins: [sveltekit_python_vercel(), sveltekit()],
+    };
+  });
+  ```
+
+- Update your `svelte.config.js`:
+
+  ```javascript
+  import adapter from "@sveltejs/adapter-vercel";
+  import { vitePreprocess } from "@sveltejs/kit/vite";
+
+  /** @type {import('@sveltejs/kit').Config} */
+  const config = {
+    preprocess: vitePreprocess(),
+    kit: {
+      adapter: adapter(),
+      moduleExtensions: [".js", ".ts", ".py"], // add ".py" to resolve +server.py endpoints
+    },
+  };
+
+  export default config;
+  ```
+
+- Update your `vercel.json`
+  - The build command prepares all your endpoints and copies them to the `/api` directory where Vercel looks for functions
+  - Functions and Routes tell Vercel how to run and redirect function calls
+  ```json
+  {
+    "buildCommand": "node ./node_modules/sveltekit-python-vercel/esm/src/vite/sveltekit_python_vercel/bin.mjs; vite build",
+    "functions": {
+      "api/**/*.py": {
+        "runtime": "@vercel/python@3.0.7"
+      }
+    },
+    "routes": [
+      {
+        "src": "/api/(.*)",
+        "dest": "api/index.py"
+      }
+    ]
+  }
+  ```
+
+- Write some `+server.py` endpoints. See the example section below.
+
+## Testing Locally
+Using [Poetry](https://python-poetry.org/) to manage your virtual environments with this package is recommended. 
+
+- Run `poetry init` to create a new virtual environment, and follow the steps. Or simply create a `pyproject.toml` like the one below.
+
+  ```toml
+  [tool.poetry]
+  name = "sveltekit-python-example"
+  version = "0.1.0"
+  description = ""
+  authors = ["Your Name <email@gmail.com>"]
+  readme = "README.md"
+
+  [tool.poetry.dependencies]
+  python = "^3.9"
+  fastapi = "^0.95.1"
+  uvicorn = "^0.22.0"
+
+
+  [build-system]
+  requires = ["poetry-core"]
+  build-backend = "poetry.core.masonry.api"
+  ```
+- Required packages are python3.9 (that is what Vercel's runtime uses), `fastapi`, and `uvicorn`.
+- Install whatever other dependencies you need from pypi using `poetry add package-name`
+
+- Run `pnpm dev` or `npm dev`
+
+
+## Example
+
+- Frontend: `/src/routes/py/+page.svelte`
+  ```html
+  <script lang="ts">
+    let a = 0;
+    let b = 0;
+    let total = 0;
+
+    async function pyAddPost() {
+      const response = await fetch('/py', {
+        method: 'POST',
+        body: JSON.stringify({ a, b }),
+        headers: {
+          'content-type': 'application/json'
+        }
+      });
+      let res = await response.json();
+      total = res.sum;
+    }
+
+    async function pyAddGet() {
+      const response = await fetch(`/py?a=${a}&b=${b}`, {
+        method: 'GET',
+        headers: {
+          'content-type': 'application/json'
+        }
+      });
+
+      let res = await response.json();
+      total = res.sum;
+    }
+  </script>
+
+  <h1>This is a SvelteKit page with a python backend.</h1>
+
+  <h3>POST Example</h3>
+  <form>
+    <input type="number" name="a" placeholder="Number 1" bind:value={a} />
+    <input type="number" name="b" placeholder="Number 2" bind:value={b} />
+    <button on:click|preventDefault={pyAddPost}>Add</button>
+  </form>
+  <h4>Total: {total}</h4>
+
+  <br />
+
+  <h3>GET Example</h3>
+  <form>
+    <input type="number" name="a" placeholder="Number 1" bind:value={a} />
+    <input type="number" name="b" placeholder="Number 2" bind:value={b} />
+    <button on:click|preventDefault={pyAddGet}>Add</button>
+  </form>
+  <h4>Total: {total}</h4>
+  ```
+
+- Backend: `/src/routes/py/+server.py`
+  ```python
+  from pydantic import BaseModel
+
+
+  class NumberSet(BaseModel):
+      a: float
+      b: float
+
+
+  async def POST(numberSet: NumberSet):
+      return {"sum": float(numberSet.a) + float(numberSet.b)}
+
+
+  async def GET(a, b):
+      return {"sum": float(a) + float(b)}
+
+  ```
+
+## Caveats
+
+There are currently a few things that have to be worked around.
+
+## Fork of `sveltekit-modal`
+
+Check out the awesome [sveltekit-modal](https://github.com/semicognitive/sveltekit-modal) package by [@semicognitive](https://github.com/semicognitive), the original way to get your python code running in SvelteKit. Modal even has GPU support for running an entire ML stack within SvelteKit.
+
+## Possible future plans
+
+- [ ] Generate endpoints (/api folder) automatically during build
+  - [ ] Auto create requirements.txt from pyproject.toml (both related to vercel functions being checked/handled before build)
+- [ ] Add form actions
+- [ ] Add load functions
+- [ ] Add helper functions to automatically call API endpoints in project

package/esm/mod.js

@@ -0,0 +1 @@
+export default true;

package/esm/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}

package/esm/src/vite/mod.js

@@ -0,0 +1,137 @@
+import { loadEnv } from "vite";
+import { $ as run$, cd as cd$, which, path, chalk, } from "zx";
+const get_pyServerEndpointAsString = (app_url, serve = false) => `
+    const handle = (method) => (async ({ request, fetch, url }) => {
+        const headers = new Headers()
+        headers.append('content-type', request.headers.get('content-type'));
+        headers.append('accept', request.headers.get('accept'));
+
+        let fullURL;
+
+        if (${serve}) {
+          fullURL = new URL(url.pathname, new URL('${app_url}')) + url.search;
+        } else {
+          fullURL = new URL('/api' + url.pathname, new URL('${app_url}')) + url.search;
+        }
+
+        console.log(\`Reached python endpoint of \${method} \${fullURL}\`)
+        let requestBody = await request.clone().text();
+        console.log(\`Body: \${requestBody}\`);
+        console.log(\`Content-Type: \${request.headers.get('content-type')}\`);
+
+        if (method === 'GET') {
+          requestBody = null;
+        }
+
+        return fetch(fullURL, { headers, method, body: requestBody, signal: request.signal, duplex: 'half' });
+    });
+    
+    export const GET = handle('GET');
+    export const POST = handle('POST');
+    export const PATCH = handle('PATCH');
+    export const PUT = handle('PUT');
+    export const DELETE = handle('DELETE');
+`;
+export async function sveltekit_python_vercel(opts = {}) {
+    const child_processes = [];
+    async function kill_all_process() {
+        for (const ps of child_processes) {
+            await ps.kill();
+            await ps.exitCode;
+        }
+    }
+    let sveltekit_url;
+    const plugin_python_serve = {
+        name: "vite-plugin-sveltekit-python-serve",
+        apply: "serve",
+        async closeBundle() {
+            await kill_all_process();
+        },
+        async configureServer({ config }) {
+            const packagelocation = path.join(config.root, "node_modules", "sveltekit-python-vercel", "esm/src/vite");
+            // copy asll +server.py files to package directory
+            run$.verbose = false;
+            run$.env.PYTHONDONTWRITEBYTECODE = "1";
+            cd$(packagelocation);
+            const python_path = opts.python_path ?? (await which("python3"));
+            const host = opts.host ?? "0.0.0.0";
+            const port = opts.port ?? 8000;
+            const local_process = run$ `${python_path} -m sveltekit_python_vercel.serve --host ${host} --port ${port} --root ${config.root}`;
+            child_processes.push(local_process);
+            sveltekit_url ??= new URL(`http://${host}:${port}`);
+            cd$(config.root);
+            // local_process.quiet();  // let it be loud for now
+            local_process.nothrow();
+            local_process.stderr.on("data", (s) => {
+                console.log(s.toString().trimEnd()); //Logs stderr always and all of stdout if 'log': True
+            });
+            local_process.stderr.on("error", (s) => {
+                console.error(chalk.red("Error: Python Serve Failed"));
+                console.error(s.toString().trimEnd());
+            });
+            local_process.stdout.on("error", (s) => {
+                console.error(chalk.red("Error: Python Serve Failed"));
+                console.error(s.toString().trimEnd());
+            });
+        },
+    };
+    const plugin_python_build = {
+        name: "vite-plugin-sveltekit_python-build",
+        apply: "build",
+        async configResolved(config) {
+            console.log("BUILD DEBUG");
+            console.log("ROOT PATH: " + config.root);
+            console.log("LOADED VERCEL URL: " + loadEnv("", config.root, "").VERCEL_URL);
+            const packagelocation = path.join(config.root, "node_modules", "sveltekit-python-vercel", "esm/src/vite");
+            console.log("PACKAGE LOCATION: " + packagelocation);
+            const python_path = opts.python_path ?? (await which("python3"));
+            await run$ `cd ${packagelocation}`;
+            await run$ `${python_path} ${packagelocation}/sveltekit_python_vercel/build.py --root ${config.root}`;
+            // check if env var starts with http
+            let httpPrefix = "";
+            if (!loadEnv("", config.root, "").VERCEL_URL.startsWith("http")) {
+                httpPrefix = "https://";
+            }
+            const api_url = path.join(httpPrefix + loadEnv("", config.root, "").VERCEL_URL);
+            // get current Vercel deploy URL
+            sveltekit_url = new URL(api_url);
+            console.log("Build API URL: " + sveltekit_url.toString());
+        },
+    };
+    const plugin_py_server_endpoint_serve = {
+        name: "vite-plugin-sveltekit_python-server-endpoint",
+        apply: "serve",
+        transform(src, id) {
+            // console.log("Transform function called for", id); // Add this line
+            if (/\.py$/.test(id)) {
+                if (sveltekit_url === undefined)
+                    throw new Error(`${plugin_python_serve.name} failed to produce a sveltekit_url`);
+                return {
+                    code: get_pyServerEndpointAsString(sveltekit_url, true),
+                    map: null, // provide source map if available
+                };
+            }
+        },
+    };
+    const plugin_py_server_endpoint_build = {
+        name: "vite-plugin-sveltekit_python-server-endpoint",
+        apply: "build",
+        transform(src, id) {
+            // console.log("Transform function called for", id); // Add this line
+            if (/\.py$/.test(id)) {
+                if (sveltekit_url === undefined)
+                    throw new Error(`${plugin_python_serve.name} failed to produce a sveltekit_url`);
+                return {
+                    code: get_pyServerEndpointAsString(sveltekit_url, false),
+                    map: null, // provide source map if available
+                };
+            }
+        },
+    };
+    return [
+        plugin_python_serve,
+        plugin_python_build,
+        plugin_py_server_endpoint_serve,
+        plugin_py_server_endpoint_build,
+    ];
+}

package/esm/src/vite/sveltekit_python_vercel/bin.mjs

@@ -0,0 +1,6 @@
+#!/usr/bin/env zx --install
+
+import {$} from "zx";
+
+const python_path = await $`which python3`;
+await $`${python_path} ./node_modules/sveltekit-python-vercel/esm/src/vite/sveltekit_python_vercel/build.py --root . --packagedir ./node_modules/sveltekit-python-vercel/esm/src/vite/sveltekit_python_vercel`;

package/esm/src/vite/sveltekit_python_vercel/build.py

@@ -0,0 +1,39 @@
+import argparse
+import shutil
+import glob
+
+from pathlib import Path
+
+parser = argparse.ArgumentParser(description="Run Sveltekit Python Deployment")
+parser.add_argument("--root", default=".", help="Root directory of Vercel project")
+parser.add_argument("--packagedir", default=None, help="Root directory of Vercel project")
+args = parser.parse_args()
+
+
+root_dir = Path(args.root).absolute()
+api_dir = root_dir / "api"
+
+if not api_dir.exists():
+    api_dir.mkdir()
+    
+if args.packagedir:
+    shutil.copy(Path(args.packagedir).absolute() / "deploy.py", api_dir / "index.py")
+    
+
+# Add all +server.py routes to web_app
+for module_path in glob.glob(str(root_dir / 'src/routes/**/+server.py'), recursive=True):
+    
+    # replace the root_dir with api_dir
+    api_route = api_dir / Path(module_path).absolute().relative_to(root_dir / "src/routes")
+    
+    if not api_route.parent.exists():
+        api_route.parent.mkdir(parents=True)
+    
+    # copy module path to api_route
+    shutil.copy(module_path, api_route.parent)
+    
+    # create __init__.py if it doesn't exist
+    if not (api_route.parent / "__init__.py").exists():
+        (api_route.parent / "__init__.py").touch()
+    
+    print(f"PYTHON ENDPOINT: Copied {module_path} to {api_route.parent}")

package/esm/src/vite/sveltekit_python_vercel/deploy.py

@@ -0,0 +1,54 @@
+import os
+import glob
+import importlib
+import importlib.util
+from pathlib import Path
+
+from fastapi import FastAPI, Request
+from fastapi.responses import JSONResponse
+
+app = FastAPI()
+
+async def hello_world():
+    return {"message": "Hello World!"}
+
+app.add_api_route("/api", hello_world, methods=["GET"])
+
+# Add all +server.py routes to web_app
+for module_path in glob.glob('./**/+server.py', recursive=True):
+
+    module_name_joined = module_path[2:].replace(os.path.sep, '.')
+    module_name, module_package = module_name_joined.rsplit('.', maxsplit=1)
+    
+    api_route = module_path[1:] if module_path.startswith('./') else module_path
+    api_route = str(Path(api_route).parent)
+
+    mod = importlib.import_module(module_name, module_package)
+
+    if hasattr(mod, 'GET'):
+        app.add_api_route(api_route, mod.GET, methods=["GET"])
+        print(f"PYTHON ENDPOINT: Added {module_path} [GET] at {api_route}")
+
+    if hasattr(mod, 'POST'):
+        app.add_api_route(api_route, mod.POST, methods=["POST"])
+        print(f"PYTHON ENDPOINT: Added {module_path} [POST] at {api_route}")
+
+    if hasattr(mod, 'PATCH'):
+        app.add_api_route(api_route, mod.PATCH, methods=["PATCH"])
+        print(f"PYTHON ENDPOINT: Added {module_path} [PATCH] at {api_route}")
+
+    if hasattr(mod, 'PUT'):
+        app.add_api_route(api_route, mod.PUT, methods=["PUT"])
+        print(f"PYTHON ENDPOINT: Added {module_path} [PUT] at {api_route}")
+
+    if hasattr(mod, 'DELETE'):
+        app.add_api_route(api_route, mod.DELETE, methods=["DELETE"])
+        print(f"PYTHON ENDPOINT: Added {module_path} [DELETE] at {api_route}")
+
+
+@app.exception_handler(Exception)
+async def unicorn_exception_handler(request: Request, exc: Exception):
+    return JSONResponse(
+        status_code=500,
+        content={"error": f"{exc}"},
+    )

package/esm/src/vite/sveltekit_python_vercel/serve.py

@@ -0,0 +1,76 @@
+import uvicorn
+import argparse
+import os
+import importlib
+import importlib.util
+import glob
+import shutil
+from pathlib import Path
+
+from fastapi import FastAPI, Request
+from fastapi.responses import JSONResponse
+
+parser = argparse.ArgumentParser(description="Run Sveltekit Python Server")
+parser.add_argument("--host", default="0.0.0.0", help="Server hostname")
+parser.add_argument("--port", type=int, default=8000, help="Server port")
+parser.add_argument("--root", default=".", help="Directory where the API is located")
+args = parser.parse_args()
+
+app = FastAPI()
+
+def app_factory():
+    return app # return the app object
+
+if __name__ == "__main__":
+    
+    root_dir = Path(args.root).absolute()
+    api_dir = Path("./sveltekit_python_vercel").absolute()
+
+    # Add all +server.py routes to web_app
+    for module_path in glob.glob(str(root_dir / 'src/routes/**/+server.py'), recursive=True):
+        
+        # replace the root_dir with api_dir
+        api_route = api_dir / Path(module_path).absolute().relative_to(root_dir/ "src/routes")
+        
+        if not api_route.parent.exists():
+            api_route.parent.mkdir(parents=True)
+        
+        # copy module path to api_route
+        shutil.copy(module_path, api_route.parent)
+        print(f"PYTHON ENDPOINT: Copied {module_path} to {api_route.parent}")
+        
+        # Get the module name from the module path
+        module_name = api_route.stem
+        
+        # Import the module dynamically
+        spec = importlib.util.spec_from_file_location(module_name, api_route)
+        mod = importlib.util.module_from_spec(spec)
+        spec.loader.exec_module(mod)
+        
+        # Get the relative path of the module from the API directory
+        rel_path = api_route.relative_to(api_dir)
+        # Convert the relative path to a string and remove the file extension
+        api_path = "/" + str(rel_path.parent)
+        
+        print("ADDING API PATH:", rel_path, api_path)
+        
+        if hasattr(mod, 'GET'):
+            app.add_api_route(api_path, mod.GET, methods=["GET"])
+
+        if hasattr(mod, 'POST'):
+            app.add_api_route(api_path, mod.POST, methods=["POST"])
+
+        if hasattr(mod, 'PATCH'):
+            app.add_api_route(api_path, mod.PATCH, methods=["PATCH"])
+
+        if hasattr(mod, 'PUT'):
+            app.add_api_route(api_path, mod.PUT, methods=["PUT"])
+
+        if hasattr(mod, 'DELETE'):
+            app.add_api_route(api_path, mod.DELETE, methods=["DELETE"])
+
+    
+    config = uvicorn.Config(app_factory, host=args.host, port=args.port, log_level="info", factory=True)
+    server = uvicorn.Server(config)
+    print(f"Hosting on http://{args.host}:{args.port}")
+    server.run()

package/package.json

@@ -0,0 +1,53 @@
+{
+  "module": "./esm/mod.js",
+  "types": "./types/mod.d.ts",
+  "name": "sveltekit-python-vercel",
+  "version": "v0.1.0",
+  "description": "Write Sveltekit server endpoints in Python and seamlessly deploy to Vercel",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/astrojarred/sveltekit-python-vercel.git"
+  },
+  "homepage": "https://github.com/astrojarred/sveltekit-python-vercel#readme",
+  "license": "MIT",
+  "exports": {
+    ".": {
+      "import": "./esm/mod.js",
+      "types": "./types/mod.d.ts"
+    },
+    "./vite": {
+      "import": "./esm/src/vite/mod.js",
+      "types": "./types/src/vite/mod.d.ts"
+    },
+    "./package.json": "./package.json"
+  },
+  "typesVersions": {
+    "*": {
+      "vite": [
+        "./types/src/vite/mod.d.ts"
+      ]
+    }
+  },
+  "keywords": [
+    "sveltekit-python-vercel",
+    "svelte-kit",
+    "sveltekit",
+    "svelte",
+    "vercel",
+    "python"
+  ],
+  "engines": {
+    "node": ">=16.0.0"
+  },
+  "author": "astrojarred",
+  "bugs": {
+    "url": "https://github.com/astrojarred/sveltekit-python-vercel/issues"
+  },
+  "dependencies": {
+    "vite": "^4.0.0",
+    "zx": "^7.0.0"
+  },
+  "peerDependencies": {
+    "vite": "^4.0.0"
+  }
+}

package/types/mod.d.ts

@@ -0,0 +1,2 @@
+declare const _default: true;
+export default _default;

package/types/src/vite/mod.d.ts

@@ -0,0 +1,8 @@
+import { type Plugin } from "vite";
+export interface SveltekitPythonOptions {
+    python_path?: string;
+    log?: boolean;
+    host?: string;
+    port?: number;
+}
+export declare function sveltekit_python_vercel(opts?: SveltekitPythonOptions): Promise<Plugin[]>;