vite-plugin-vercel 0.0.7 → 0.1.2

package/README.md

@@ -2,9 +2,29 @@
 
 This is a **Work In Progress** Vercel adapter for [`vite`](https://vitejs.dev/).
 
+Its purpose is to help you bundle your application in `.vercel` folder as supported by
+[Vercel API v3](https://vercel.com/docs/build-output-api/v3).
+
+## Features
+
+- [x] [SSG/Static files support](https://vercel.com/docs/build-output-api/v3#vercel-primitives/static-files)
+  - see [`prerender` config](/packages/vercel/src/types.ts#L33)
+- [x] [SSR/Serverless functions support](https://vercel.com/docs/build-output-api/v3#vercel-primitives/serverless-functions)
+  - `.[jt]s` files under the `<root>/api` folder of your project are automatically bundled as Serverless functions under `.vercel/output/functions/api/*.func`
+  - see [`additionalEndpoints` config](/packages/vercel/src/types.ts#L54)
+- [x] [ISR/Prerender functions support](https://vercel.com/docs/build-output-api/v3#vercel-primitives/prerender-functions)
+  - see [`isr` config](/packages/vercel/src/types.ts#L81). Also see implementation of [vite-plugin-ssr](/packages/vite-plugin-ssr/vite-plugin-ssr.ts) for example
+- [ ] [Edge functions support](https://vercel.com/docs/build-output-api/v3#vercel-primitives/edge-functions)
+- [ ] [Images optimization support](https://vercel.com/docs/build-output-api/v3#build-output-configuration/supported-properties/images)
+- [ ] [Preview mode support](https://vercel.com/docs/build-output-api/v3#features/preview-mode)
+- [x] [Advanced config override](/packages/vercel/src/types.ts#L15)
+  - [ ] Complete config override
+
 ## Usage
 
-Install as a dev dependency and add it to your Vite config like this:
+First, make sure `ENABLE_VC_BUILD=1` is declared as an Environment Variable in your deployment configuration.
+
+Then, install this package as a dev dependency and add it to your Vite config like this:
 
 ```ts
 import { defineConfig } from 'vite';
@@ -21,30 +41,18 @@ export default defineConfig({
 [vite-plugin-ssr](https://vite-plugin-ssr.com/) will support this plugin when stable.
 In the meantime, you can add experimental support yourself.
 
-First copy [prerender](../../prerender) folder to the root of your project.
-Then, update your vercel config:
+Install `@magne4000/vite-plugin-vercel-ssr` package, and update your vite config:
 
 ```ts
-// vercel.config.ts
-// A TS config is prefered if your project is of { type: "module" }
-
-import module from 'module';
+// vite.config.ts
 import { defineConfig } from 'vite';
 import ssr from 'vite-plugin-ssr/plugin';
 import vercel from 'vite-plugin-vercel';
-
-// FIX esbuild bug https://github.com/evanw/esbuild/pull/2067
-// probably not necessary when `./prerender/vite-plugin-ssr` will be included in `vite-plugin-ssr`
-// eslint-disable-next-line no-undef
-globalThis.require = module.createRequire(import.meta.url);
+import vercelSsr from '@magne4000/vite-plugin-vercel-ssr';
 
 export default defineConfig(async ({ command, mode }) => {
-  // Dynamic import to bypass esbuild compilation issue.
-  // If you are not using ESM, could me move as a top synchronous import
-  const vitePluginSsrVercelPlugin = await import('./prerender/vite-plugin-ssr');
-
   return {
-    plugins: [ssr(), vercel(), vitePluginSsrVercelPlugin.default()],
+    plugins: [ssr(), vercel(), vercelSsr()],
     build: {
       polyfillDynamicImport: false,
     },
@@ -54,3 +62,11 @@ export default defineConfig(async ({ command, mode }) => {
   };
 });
 ```
+
+### Config
+
+See [TS types](/packages/vercel/src/types.ts#L15) for details.
+
+## Demo
+
+https://test-vite-vercel-plugin.vercel.app/

package/dist/index.cjs

@@ -254,7 +254,7 @@ function getEntries(resolvedConfig) {
     const parsed = import_path3.default.parse(outFilePath);
     const entry = {
       source: filePath,
-      destination: `api/${import_path3.default.join(parsed.dir, parsed.name)}.func`
+      destination: `api/${import_path3.default.posix.join(parsed.dir, parsed.name)}.func`
     };
     entryPoints.push(entry);
     return entryPoints;
@@ -375,6 +375,7 @@ async function getIsrConfig(resolvedConfig) {
 }
 
 // src/index.ts
+var import_path5 = __toESM(require("path"), 1);
 function vercelPlugin() {
   let resolvedConfig;
   return {
@@ -398,12 +399,13 @@ function vercelPlugin() {
       var _a;
       if (!((_a = resolvedConfig.build) == null ? void 0 : _a.ssr))
         return;
+      const userOverrides = await computeStaticHtmlOverrides(resolvedConfig);
       const overrides = await execPrerender(resolvedConfig);
       await buildEndpoints(resolvedConfig);
       const rewrites = await buildPrerenderConfigs(resolvedConfig);
       await writeConfig(resolvedConfig, {
         routes: [{ handle: "filesystem" }, ...rewrites],
-        overrides
+        overrides: __spreadValues(__spreadValues({}, userOverrides), overrides)
       });
     }
   };
@@ -417,6 +419,28 @@ async function cleanOutputDirectory(resolvedConfig) {
     force: true
   });
 }
+async function computeStaticHtmlOverrides(resolvedConfig) {
+  const staticAbsolutePath = getOutput(resolvedConfig, "static");
+  const files = await getStaticHtmlFiles(resolvedConfig, staticAbsolutePath);
+  return files.reduce((acc, curr) => {
+    const relPath = import_path5.default.relative(staticAbsolutePath, curr);
+    const parsed = import_path5.default.parse(relPath);
+    const pathJoined = import_path5.default.join(parsed.dir, parsed.name);
+    acc[relPath] = {
+      path: pathJoined
+    };
+    return acc;
+  }, {});
+}
+async function getStaticHtmlFiles(resolvedConfig, src) {
+  const entries = await import_promises5.default.readdir(src, { withFileTypes: true });
+  const htmlFiles = [];
+  for (const entry of entries) {
+    const srcPath = import_path5.default.join(src, entry.name);
+    entry.isDirectory() ? htmlFiles.push(...await getStaticHtmlFiles(resolvedConfig, srcPath)) : srcPath.endsWith(".html") ? htmlFiles.push(srcPath) : void 0;
+  }
+  return htmlFiles;
+}
 function allPlugins() {
   return [vercelPlugin()];
 }

package/dist/index.js

@@ -231,7 +231,7 @@ function getEntries(resolvedConfig) {
     const parsed = path3.parse(outFilePath);
     const entry = {
       source: filePath,
-      destination: `api/${path3.join(parsed.dir, parsed.name)}.func`
+      destination: `api/${path3.posix.join(parsed.dir, parsed.name)}.func`
     };
     entryPoints.push(entry);
     return entryPoints;
@@ -352,6 +352,7 @@ async function getIsrConfig(resolvedConfig) {
 }
 
 // src/index.ts
+import path5 from "path";
 function vercelPlugin() {
   let resolvedConfig;
   return {
@@ -375,12 +376,13 @@ function vercelPlugin() {
       var _a;
       if (!((_a = resolvedConfig.build) == null ? void 0 : _a.ssr))
         return;
+      const userOverrides = await computeStaticHtmlOverrides(resolvedConfig);
       const overrides = await execPrerender(resolvedConfig);
       await buildEndpoints(resolvedConfig);
       const rewrites = await buildPrerenderConfigs(resolvedConfig);
       await writeConfig(resolvedConfig, {
         routes: [{ handle: "filesystem" }, ...rewrites],
-        overrides
+        overrides: __spreadValues(__spreadValues({}, userOverrides), overrides)
       });
     }
   };
@@ -394,6 +396,28 @@ async function cleanOutputDirectory(resolvedConfig) {
     force: true
   });
 }
+async function computeStaticHtmlOverrides(resolvedConfig) {
+  const staticAbsolutePath = getOutput(resolvedConfig, "static");
+  const files = await getStaticHtmlFiles(resolvedConfig, staticAbsolutePath);
+  return files.reduce((acc, curr) => {
+    const relPath = path5.relative(staticAbsolutePath, curr);
+    const parsed = path5.parse(relPath);
+    const pathJoined = path5.join(parsed.dir, parsed.name);
+    acc[relPath] = {
+      path: pathJoined
+    };
+    return acc;
+  }, {});
+}
+async function getStaticHtmlFiles(resolvedConfig, src) {
+  const entries = await fs5.readdir(src, { withFileTypes: true });
+  const htmlFiles = [];
+  for (const entry of entries) {
+    const srcPath = path5.join(src, entry.name);
+    entry.isDirectory() ? htmlFiles.push(...await getStaticHtmlFiles(resolvedConfig, srcPath)) : srcPath.endsWith(".html") ? htmlFiles.push(srcPath) : void 0;
+  }
+  return htmlFiles;
+}
 function allPlugins() {
   return [vercelPlugin()];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-vercel",
-  "version": "0.0.7",
+  "version": "0.1.2",
   "type": "module",
   "files": [
     "dist",
@@ -23,20 +23,20 @@
     "vite": "^2.9.9"
   },
   "devDependencies": {
-    "@types/node": "^17.0.34",
-    "@typescript-eslint/eslint-plugin": "^5.24.0",
-    "@typescript-eslint/parser": "^5.24.0",
-    "eslint": "^8.15.0",
-    "eslint-plugin-solid": "^0.4.7",
-    "tsup": "^5.12.8",
-    "typescript": "^4.6.4"
+    "@types/node": "^17.0.36",
+    "@typescript-eslint/eslint-plugin": "^5.26.0",
+    "@typescript-eslint/parser": "^5.26.0",
+    "eslint": "^8.16.0",
+    "tsup": "^6.0.1",
+    "typescript": "^4.7.2",
+    "vite": "^2.9.9"
   },
   "dependencies": {
     "@brillout/libassert": "^0.5.6",
-    "@vercel/routing-utils": "^1.13.2",
-    "esbuild": "^0.14.39",
+    "@vercel/routing-utils": "^1.13.3",
+    "esbuild": "^0.14.42",
     "fast-glob": "^3.2.11",
-    "zod": "^3.16.0"
+    "zod": "^3.17.3"
   },
   "scripts": {
     "build": "tsup",