vite-plugin-vercel 0.2.0 → 0.2.2

package/README.md

@@ -1,42 +1,43 @@
 # vite-plugin-vercel
 
-This is a **Work In Progress** Vercel adapter for [`vite`](https://vitejs.dev/).
+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)
+- [x] [SSG/Static files support](https://vercel.com/docs/build-output-api/v3/primitives#static-files)
+  - see [`prerender` config](/packages/vercel/src/types.ts#L37)
+- [x] [SSR/Serverless functions support](https://vercel.com/docs/build-output-api/v3/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
-- [x] [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)
+  - see [`additionalEndpoints` config](/packages/vercel/src/types.ts#L62)
+- [x] [ISR/Prerender functions support](https://vercel.com/docs/build-output-api/v3/primitives#prerender-functions)
+  - see [`isr` config](/packages/vercel/src/types.ts#L89). Also see implementation of [vite-plugin-ssr](/packages/vite-plugin-ssr/vite-plugin-ssr.ts) for example
+- [x] [Edge functions support](https://vercel.com/docs/build-output-api/v3/primitives#edge-functions)
+- [ ] [Images optimization support](https://vercel.com/docs/build-output-api/v3/configuration#images)
+- [ ] [Preview mode support](https://vercel.com/docs/build-output-api/v3/features#preview-mode)
+- [x] [Advanced config override](/packages/vercel/src/types.ts#L19)
   - [ ] Complete config override
 
-## Usage
+## Simple usage
 
-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:
+Then, install this package as a dev dependency and add it to your Vite config:
 
 ```ts
+// vite.config.ts
 import { defineConfig } from 'vite';
 import vercel from 'vite-plugin-vercel';
-import ssr from 'vite-plugin-ssr/plugin';
 
 export default defineConfig({
-  plugins: [ssr(), vercel()],
+  plugins: [vercel()],
+  vercel: {
+    // optional configuration options, see below for details
+  },
 });
 ```
 
-### Usage with vite-plugin-ssr
+## Usage with vite-plugin-ssr
 
 [vite-plugin-ssr](https://vite-plugin-ssr.com/) is supported through [@magne4000/vite-plugin-vercel-ssr](/packages/vite-plugin-ssr/README.md) plugin.
 
@@ -53,15 +54,111 @@ export default defineConfig(async ({ command, mode }) => {
   return {
     plugins: [ssr(), vercel(), vercelSsr()],
     vercel: {
-      // Tweak what you need, check TS definition for details
+      // optional configuration options, see below for details
     },
   };
 });
 ```
 
-### Config
+## Advanced usage
+
+```ts
+// vite.config.ts
+import { defineConfig } from 'vite';
+import vercel from 'vite-plugin-vercel';
 
-See [TS types](/packages/vercel/src/types.ts#L15) for details.
+export default defineConfig({
+  plugins: [vercel()],
+  vercel: {
+    // All the followings optional
+
+    /**
+     * How long Functions should be allowed to run for every request, in seconds.
+     * If left empty, default value for your plan will be used.
+     */
+    defaultMaxDuration: 30,
+    /**
+     * Default expiration time (in seconds) for prerender functions.
+     * Defaults to 86400 seconds (24h).
+     */
+    expiration: 86400,
+    /**
+     * Also known as Server Side Generation, or SSG.
+     * If present, this function is responsible to create static files in `.vercel/output/static`.
+     * Defaults to `false`, which disables prerendering.
+     */
+    prerender(resolvedConfig) {
+      // Check `/packages/vite-plugin-ssr/vite-plugin-ssr.ts` `prerender` for an example
+    },
+    /**
+     * See https://vercel.com/docs/projects/project-configuration#rewrites
+     */
+    rewrites: [{ source: '/about', destination: '/about-our-company.html' }],
+    /**
+     * See https://vercel.com/docs/projects/project-configuration#redirects
+     */
+    redirects: [
+      { source: '/me', destination: '/profile.html', permanent: false },
+    ],
+    /**
+     * See https://vercel.com/docs/projects/project-configuration#cleanurls
+     */
+    cleanUrls: true,
+    /**
+     * See https://vercel.com/docs/projects/project-configuration#trailingslash
+     */
+    trailingSlash: true,
+    /**
+     * By default, all `api/*` endpoints are compiled under `.vercel/output/functions/api/*.func`.
+     * If others serverless functions need to be compiled under `.vercel/output/functions`, they should be added here.
+     * For instance, a framework can leverage this to have a generic ssr endpoint
+     * without requiring the user to write any code.
+     */
+    additionalEndpoints: [
+      {
+        // can also be an Object representing an esbuild StdinOptions
+        source: '/path/to/file.ts',
+        // URL path of the handler, will be generated to `.vercel/output/functions/api/file.func/index.js`
+        destination: '/api/file',
+      },
+    ],
+    /**
+     * Advanced configuration to override .vercel/output/config.json
+     * See https://vercel.com/docs/build-output-api/v3/configuration#configuration
+     */
+    config: {
+      // routes?: Route[];
+      // images?: ImagesConfig;
+      // wildcard?: WildcardConfig;
+      // overrides?: OverrideConfig;
+      // cache?: string[];
+      // crons?: CronsConfig;
+    },
+    /**
+     * ISR and SSG pages are mutually exclusive. If a page is found in both, ISR prevails.
+     * Keys are path relative to .vercel/output/functions directory, either without extension,
+     * or with `.prerender-config.json` extension.
+     * If you have multiple isr configurations pointing to the same underlying function, you can leverage the `symlink`
+     * property.
+     *
+     * Can be an object or a function returning an object (or a Promise of an object).
+     *
+     * Check `/packages/vite-plugin-ssr/vite-plugin-ssr.ts` `vitePluginVercelVpsIsrPlugin` for advanced usage.
+     */
+    isr: {
+      // `symlink: 'ssr_'` means that a function is available under `.vercel/output/functions/ssr_.func`
+      '/pages/a': { expiration: 15, symlink: 'ssr_', route: '^/a/.*$' },
+      '/pages/b/c': { expiration: 15, symlink: 'ssr_', route: '^/b/c/.*$' },
+      '/pages/d': { expiration: 15, symlink: 'ssr_', route: '^/d$' },
+      '/pages/e': { expiration: 25 },
+    },
+    /**
+     * Defaults to `.vercel/output`. Mostly useful for testing purpose
+     */
+    outDir: '.vercel/output',
+  },
+});
+```
 
 ## Demo
 

package/dist/index.cjs

@@ -322,7 +322,13 @@ async function buildFn(resolvedConfig, entry, buildOptions) {
     }
   }
   if (entry.edge) {
-    options.conditions = ["edge-light", ...options.conditions ?? []];
+    options.conditions = [
+      "edge-light",
+      "browser",
+      "module",
+      "import",
+      "require"
+    ];
   }
   await (0, import_esbuild.build)(options);
   await writeVcConfig(resolvedConfig, entry.destination, Boolean(entry.edge));
@@ -481,25 +487,24 @@ async function getIsrConfig(resolvedConfig) {
 var import_path5 = __toESM(require("path"), 1);
 function vercelPlugin() {
   let resolvedConfig;
+  let vpsFound = false;
   return {
     apply: "build",
     name: "vite-plugin-vercel",
     enforce: "post",
     configResolved(config) {
       resolvedConfig = config;
-    },
-    async buildStart() {
-      if (process.env.VERCEL_ENV === "production" && !process.env.ENABLE_VC_BUILD) {
-        throw new Error(
-          "Missing ENABLE_VC_BUILD=1 to your environment variables in your project settings"
-        );
-      }
+      vpsFound = resolvedConfig.plugins.some(
+        (p) => p.name.startsWith("vite-plugin-ssr:")
+      );
     },
     async writeBundle() {
       var _a;
       if (!((_a = resolvedConfig.build) == null ? void 0 : _a.ssr)) {
         await cleanOutputDirectory(resolvedConfig);
-        return;
+        if (vpsFound) {
+          return;
+        }
       }
       const overrides = await execPrerender(resolvedConfig);
       const userOverrides = await computeStaticHtmlOverrides(resolvedConfig);

package/dist/index.d.ts

@@ -521,8 +521,8 @@ type ViteVercelRedirect = Redirect & {
 };
 interface ViteVercelConfig {
     /**
-     * How long Functions should be allowed to run for every request in seconds.
-     * If left empty, default value for your plan will is used.
+     * How long Functions should be allowed to run for every request, in seconds.
+     * If left empty, default value for your plan will be used.
      */
     defaultMaxDuration?: number;
     /**
@@ -534,10 +534,26 @@ interface ViteVercelConfig {
     expiration?: number;
     /**
      * Also known as Server Side Generation, or SSG.
-     * If present, must build static files in `.vercel/output/static`.
-     * Can be set to `false` to disable prerendering completely.
+     * If present, this function is responsible to create static files in `.vercel/output/static`.
+     * Defaults to `false`, which disables prerendering.
      */
     prerender?: ViteVercelPrerenderFn | false;
+    /**
+     * @see {@link https://vercel.com/docs/projects/project-configuration#rewrites}
+     */
+    rewrites?: ViteVercelRewrite[];
+    /**
+     * @see {@link https://vercel.com/docs/projects/project-configuration#redirects}
+     */
+    redirects?: ViteVercelRedirect[];
+    /**
+     * @see {@link https://vercel.com/docs/projects/project-configuration#cleanurls}
+     */
+    cleanUrls?: boolean;
+    /**
+     * @see {@link https://vercel.com/docs/projects/project-configuration#trailingslash}
+     */
+    trailingSlash?: boolean;
     /**
      * By default, all `api/*` endpoints are compiled under `.vercel/output/functions/api/*.func`.
      * If others serverless functions need to be compiled under `.vercel/output/functions`, they should be added here.
@@ -558,14 +574,10 @@ interface ViteVercelConfig {
      * }
      * ```
      */
-    rewrites?: ViteVercelRewrite[];
-    redirects?: ViteVercelRedirect[];
-    cleanUrls?: boolean;
-    trailingSlash?: boolean;
     additionalEndpoints?: ViteVercelApiEntry[];
     /**
      * Advanced configuration to override .vercel/output/config.json
-     * @see {@link https://vercel.com/docs/build-output-api/v3#build-output-configuration}
+     * @see {@link https://vercel.com/docs/build-output-api/v3/configuration#configuration}
      * @protected
      */
     config?: Partial<Omit<VercelOutputConfig, 'version'>>;

package/dist/index.js

@@ -288,7 +288,13 @@ async function buildFn(resolvedConfig, entry, buildOptions) {
     }
   }
   if (entry.edge) {
-    options.conditions = ["edge-light", ...options.conditions ?? []];
+    options.conditions = [
+      "edge-light",
+      "browser",
+      "module",
+      "import",
+      "require"
+    ];
   }
   await build(options);
   await writeVcConfig(resolvedConfig, entry.destination, Boolean(entry.edge));
@@ -447,25 +453,24 @@ async function getIsrConfig(resolvedConfig) {
 import path5 from "path";
 function vercelPlugin() {
   let resolvedConfig;
+  let vpsFound = false;
   return {
     apply: "build",
     name: "vite-plugin-vercel",
     enforce: "post",
     configResolved(config) {
       resolvedConfig = config;
-    },
-    async buildStart() {
-      if (process.env.VERCEL_ENV === "production" && !process.env.ENABLE_VC_BUILD) {
-        throw new Error(
-          "Missing ENABLE_VC_BUILD=1 to your environment variables in your project settings"
-        );
-      }
+      vpsFound = resolvedConfig.plugins.some(
+        (p) => p.name.startsWith("vite-plugin-ssr:")
+      );
     },
     async writeBundle() {
       var _a;
       if (!((_a = resolvedConfig.build) == null ? void 0 : _a.ssr)) {
         await cleanOutputDirectory(resolvedConfig);
-        return;
+        if (vpsFound) {
+          return;
+        }
       }
       const overrides = await execPrerender(resolvedConfig);
       const userOverrides = await computeStaticHtmlOverrides(resolvedConfig);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-vercel",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "type": "module",
   "files": [
     "dist",
@@ -24,20 +24,20 @@
     "vite": "^4.2.0"
   },
   "devDependencies": {
-    "@types/node": "^16.18.30",
-    "@typescript-eslint/eslint-plugin": "^5.59.5",
-    "@typescript-eslint/parser": "^5.59.5",
-    "eslint": "^8.40.0",
+    "@types/node": "^16.18.48",
+    "@typescript-eslint/eslint-plugin": "^5.62.0",
+    "@typescript-eslint/parser": "^5.62.0",
+    "eslint": "^8.48.0",
     "tsup": "^6.7.0",
-    "typescript": "^5.0.4",
-    "vite": "^4.3.5"
+    "typescript": "^5.2.2",
+    "vite": "^4.4.9"
   },
   "dependencies": {
     "@brillout/libassert": "^0.5.8",
     "@vercel/routing-utils": "^2.2.1",
     "esbuild": "^0.17.19",
-    "fast-glob": "^3.2.12",
-    "zod": "^3.21.4"
+    "fast-glob": "^3.3.1",
+    "zod": "^3.22.2"
   },
   "scripts": {
     "build": "tsup",