From 4fe537a994aa99504320c724e5e993513953235a Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Thu, 1 Sep 2022 13:50:11 +0000 Subject: [PATCH 1/8] update ssr page & all deploy guides for astro add guidance --- src/pages/en/guides/deploy.md | 4 +-- src/pages/en/guides/deploy/cloudflare.md | 14 +++++++--- src/pages/en/guides/deploy/deno.md | 12 +++++++-- src/pages/en/guides/deploy/flightcontrol.md | 2 -- src/pages/en/guides/deploy/netlify.md | 28 ++++++++++++-------- src/pages/en/guides/deploy/vercel.md | 21 ++++++++++----- src/pages/en/guides/server-side-rendering.md | 12 +++++++-- 7 files changed, 63 insertions(+), 30 deletions(-) diff --git a/src/pages/en/guides/deploy.md b/src/pages/en/guides/deploy.md index eb8eff6ee6b5f..cef3940edf5dd 100644 --- a/src/pages/en/guides/deploy.md +++ b/src/pages/en/guides/deploy.md @@ -78,7 +78,7 @@ By default, the build output will be placed at `dist/`. This location can be cha :::note Before deploying your Astro site with [SSR (server-side rendering)](/en/guides/server-side-rendering/) enabled, make sure you have: - - installed the [appropriate adapter](/en/guides/server-side-rendering/#enabling-ssr-in-your-project) to your project dependencies - - [added the adapter](/en/reference/configuration-reference/#integrations) to your `astro.config.mjs` file's import and default export + - Installed the [appropriate adapter](/en/guides/server-side-rendering/#enabling-ssr-in-your-project) to your project dependencies (either manually, or using the adapter's `astro add` command, e.g. `npx astro add netlify`). + - [Added the adapter](/en/reference/configuration-reference/#integrations) to your `astro.config.mjs` file's import and default export when installing manually. (The `astro add` command will take care of this step for you!) ::: diff --git a/src/pages/en/guides/deploy/cloudflare.md b/src/pages/en/guides/deploy/cloudflare.md index 3c9a2d0a9cfb1..ec70a1a63ecbd 100644 --- a/src/pages/en/guides/deploy/cloudflare.md +++ b/src/pages/en/guides/deploy/cloudflare.md @@ -64,14 +64,20 @@ It's then possible to update the preview script in your `package.json` to `"prev ## How to deploy an SSR site -You can also deploy an Astro SSR site to Cloudflare Pages using the [`@astrojs/cloudflare` adapter](https://github.com/withastro/astro/tree/main/packages/integrations/cloudflare#readme). +You can also deploy an Astro SSR site to Cloudflare Pages using the [`@astrojs/cloudflare` adapter](/en/guides/integrations-guide/cloudflare/). -To enable an SSR site and deploy to Cloudflare Pages, you will need to: +Add the Cloudflare adapter to enable SSR in your Astro project with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step. -1. Add the [`@astrojs/cloudflare` adapter](https://github.com/withastro/astro/tree/main/packages/integrations/cloudflare#readme) to your project's `package.json` by running: +```bash +npx astro add cloudflare +``` + +If you prefer to install the adapter manually instead, complete the following two steps: + +1. Add the `@astrojs/cloudflare` adapter to your project's `package.json` by running: ```bash -npm install --save-dev @astrojs/cloudflare +npm install @astrojs/cloudflare ``` 2. Add the following to your `astro.config.mjs` file: diff --git a/src/pages/en/guides/deploy/deno.md b/src/pages/en/guides/deploy/deno.md index 0bebd9f5134c3..ef030ad66ea37 100644 --- a/src/pages/en/guides/deploy/deno.md +++ b/src/pages/en/guides/deploy/deno.md @@ -21,7 +21,15 @@ Your Astro project can be deployed to [Deno Deploy](https://deno.com/deploy) as To enable SSR in your Astro project and deploy on Deno Deploy: -1. Install [the Deno adapter](https://github.com/withastro/astro/tree/main/packages/integrations/deno) to your project’s dependencies. +Add [the Deno adapter](/en/guides/integrations-guide/deno/) to enable SSR in your Astro project with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step. + +```bash +npx astro add deno +``` + +If you prefer to install the adapter manually instead, complete the following two steps: + +1. Install [the `@astrojs/deno` adapter](https://github.com/withastro/astro/tree/main/packages/integrations/deno) to your project’s dependencies. ```bash npm install @astrojs/deno @@ -40,7 +48,7 @@ To enable SSR in your Astro project and deploy on Deno Deploy: }); ``` -1. Update your `preview` script in `package.json` with the change below. +Next, Update your `preview` script in `package.json` with the change below. ```json del={8} ins={9} // package.json diff --git a/src/pages/en/guides/deploy/flightcontrol.md b/src/pages/en/guides/deploy/flightcontrol.md index 2a0362fbd1e3e..5c4d662a9a370 100644 --- a/src/pages/en/guides/deploy/flightcontrol.md +++ b/src/pages/en/guides/deploy/flightcontrol.md @@ -25,5 +25,3 @@ Supports both static and SSR Astro sites. To deploy with SSR support, make sure you first set up the [`@astro/node`](/en/guides/integrations-guide/node/) adapter. Then, follow the steps above choosing the appropriate configurations for Astro SSR. - - diff --git a/src/pages/en/guides/deploy/netlify.md b/src/pages/en/guides/deploy/netlify.md index 03a5637a83b8b..da542bb80acf0 100644 --- a/src/pages/en/guides/deploy/netlify.md +++ b/src/pages/en/guides/deploy/netlify.md @@ -20,31 +20,37 @@ Your Astro project is a static site by default. You don’t need any extra confi To enable SSR in your Astro project and deploy on Netlify: -1. Install [the Netlify adapter](https://github.com/withastro/astro/tree/main/packages/integrations/netlify) to your project’s dependencies. +Add [the Netlify adapter](/en/guides/integrations-guide/netlify/) to enable SSR in your Astro project with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step. + +```bash +npx astro add netlify +``` + +If you prefer to install the adapter manually instead, complete the following two steps: + +1. Install [the `@astrojs/netlify` adapter](https://github.com/withastro/astro/tree/main/packages/integrations/netlify) to your project’s dependencies. ```bash - npm install --save-dev @astrojs/netlify + npm install @astrojs/netlify ``` 1. Add two new lines to your `astro.config.mjs` project configuration file. - ```diff + ```js title="astro.config.mjs" ins={2, 5-6} import { defineConfig } from 'astro/config'; - + import netlify from '@astrojs/netlify/functions'; + import netlify from '@astrojs/netlify/serverless'; export default defineConfig({ - + output: 'server', - + adapter: netlify(), + output: 'server', + adapter: netlify(), }); ``` To render your project using [Netlify's experimental Edge Functions](https://docs.netlify.com/netlify-labs/experimental-features/edge-functions/#app) instead, change the `netlify/functions` import in the Astro config file to use `netlify/edge-functions`. - ```diff + ```js title="astro.config.mjs" ins={3} del={2} import { defineConfig } from 'astro/config'; - // change this line - - import netlify from '@astrojs/netlify/functions'; - // to this line - + import netlify from '@astrojs/netlify/edge-functions'; + import netlify from '@astrojs/netlify/functions'; + import netlify from '@astrojs/netlify/edge-functions'; export default defineConfig({ output: 'server', diff --git a/src/pages/en/guides/deploy/vercel.md b/src/pages/en/guides/deploy/vercel.md index 1bf1fdd9d403f..eeef7d70d2dfc 100644 --- a/src/pages/en/guides/deploy/vercel.md +++ b/src/pages/en/guides/deploy/vercel.md @@ -31,22 +31,29 @@ There is currently a Vercel issue displaying a 404 page on Astro websites. Until To enable SSR in your Astro project and deploy on Vercel: -1. Install [the Vercel adapter](https://github.com/withastro/astro/tree/main/packages/integrations/vercel) to your project’s dependencies. +Add [the Vercel adapter](/en/guides/integrations-guide/vercel/) to enable SSR in your Astro project with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step. + +```bash +npx astro add vercel +``` + +If you prefer to install the adapter manually instead, complete the following two steps: + +1. Install [the `@astrojs/vercel` adapter](/en/guides/integrations-guide/vercel/) to your project’s dependencies. ```bash - npm install --save-dev @astrojs/vercel + npm install @astrojs/vercel ``` 1. Add two new lines to your `astro.config.mjs` project configuration file. - ```diff - // astro.config.mjs + ```js title="astro.config.mjs" ins={2, 5-6} import { defineConfig } from 'astro/config'; - + import vercel from '@astrojs/vercel/serverless'; + import vercel from '@astrojs/vercel/serverless'; export default defineConfig({ - + output: 'server', - + adapter: vercel(), + output: 'server', + adapter: vercel(), }); ``` diff --git a/src/pages/en/guides/server-side-rendering.md b/src/pages/en/guides/server-side-rendering.md index bfa813e5c89d6..55ba67ffb3d4f 100644 --- a/src/pages/en/guides/server-side-rendering.md +++ b/src/pages/en/guides/server-side-rendering.md @@ -24,11 +24,19 @@ The following adapters are available today with more to come in the future: - [Node.js](/en/guides/integrations-guide/node/) - [Vercel](/en/guides/integrations-guide/vercel/) -You can find instructions at the individual adapter links above to complete the following two steps (using `my-adapter` as an example placeholder) to enable SSR. + +You can add any of the official adapters with the following `astro add` command. This will install the adapter and make the appropriate changes to your `astro.config.mjs` file in one step. For example, to install the Netlify adapter, run: + +```bash +npx astro add netlify +``` + +You can also add an adapter manually by installing the package and updating `astro.config.mjs` yourself. (See the links above for adapter-specific instructions to complete the following two steps to enable SSR.) Using `my-adapter` as an example placeholder, the instructions will look something like: + 1. Install the adapter to your project dependencies via npm or your package manager of choice ```bash - npm install --save-dev @astrojs/my-adapter + npm install @astrojs/my-adapter ``` 1. [Add the adapter](/en/reference/configuration-reference/) to your `astro.config.mjs` file's import and default export From 7493227824cb2a48aff458477d1943c7b2501a58 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Thu, 1 Sep 2022 17:29:48 -0300 Subject: [PATCH 2/8] netlify import needs functions --- src/pages/en/guides/deploy/netlify.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/en/guides/deploy/netlify.md b/src/pages/en/guides/deploy/netlify.md index da542bb80acf0..faa614c047601 100644 --- a/src/pages/en/guides/deploy/netlify.md +++ b/src/pages/en/guides/deploy/netlify.md @@ -38,7 +38,7 @@ If you prefer to install the adapter manually instead, complete the following tw ```js title="astro.config.mjs" ins={2, 5-6} import { defineConfig } from 'astro/config'; - import netlify from '@astrojs/netlify/serverless'; + import netlify from '@astrojs/netlify/functions'; export default defineConfig({ output: 'server', From a12ac30de6f03934366f860fc6cf7aee6ca16d47 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Thu, 1 Sep 2022 17:36:02 -0300 Subject: [PATCH 3/8] any package manager --- src/pages/en/guides/server-side-rendering.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/en/guides/server-side-rendering.md b/src/pages/en/guides/server-side-rendering.md index 55ba67ffb3d4f..7d7cef964dee6 100644 --- a/src/pages/en/guides/server-side-rendering.md +++ b/src/pages/en/guides/server-side-rendering.md @@ -33,7 +33,7 @@ npx astro add netlify You can also add an adapter manually by installing the package and updating `astro.config.mjs` yourself. (See the links above for adapter-specific instructions to complete the following two steps to enable SSR.) Using `my-adapter` as an example placeholder, the instructions will look something like: -1. Install the adapter to your project dependencies via npm or your package manager of choice +1. Install the adapter to your project dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal: ```bash npm install @astrojs/my-adapter From 2435ab12c8bf883cf57239cb9f6f27e65b8a1e85 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Thu, 1 Sep 2022 17:36:44 -0300 Subject: [PATCH 4/8] any package manager --- src/pages/en/guides/deploy/vercel.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/en/guides/deploy/vercel.md b/src/pages/en/guides/deploy/vercel.md index eeef7d70d2dfc..a64eb3077d5a1 100644 --- a/src/pages/en/guides/deploy/vercel.md +++ b/src/pages/en/guides/deploy/vercel.md @@ -39,7 +39,7 @@ npx astro add vercel If you prefer to install the adapter manually instead, complete the following two steps: -1. Install [the `@astrojs/vercel` adapter](/en/guides/integrations-guide/vercel/) to your project’s dependencies. +1. Install [the `@astrojs/vercel` adapter](/en/guides/integrations-guide/vercel/) to your project’s dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal: ```bash npm install @astrojs/vercel From 9926ecba66c7620da5a891573a7fd3851cd2d586 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Thu, 1 Sep 2022 17:37:36 -0300 Subject: [PATCH 5/8] any package manager --- src/pages/en/guides/deploy/netlify.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/en/guides/deploy/netlify.md b/src/pages/en/guides/deploy/netlify.md index faa614c047601..a1142af5ee387 100644 --- a/src/pages/en/guides/deploy/netlify.md +++ b/src/pages/en/guides/deploy/netlify.md @@ -28,7 +28,7 @@ npx astro add netlify If you prefer to install the adapter manually instead, complete the following two steps: -1. Install [the `@astrojs/netlify` adapter](https://github.com/withastro/astro/tree/main/packages/integrations/netlify) to your project’s dependencies. +1. Install [the `@astrojs/netlify` adapter](https://github.com/withastro/astro/tree/main/packages/integrations/netlify) to your project’s dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal: ```bash npm install @astrojs/netlify From ed9e7478673d9b1f72c1903c0318a310117612ce Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Thu, 1 Sep 2022 17:38:19 -0300 Subject: [PATCH 6/8] any package manager --- src/pages/en/guides/deploy/deno.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/en/guides/deploy/deno.md b/src/pages/en/guides/deploy/deno.md index ef030ad66ea37..12ddf0e9337d6 100644 --- a/src/pages/en/guides/deploy/deno.md +++ b/src/pages/en/guides/deploy/deno.md @@ -29,7 +29,7 @@ npx astro add deno If you prefer to install the adapter manually instead, complete the following two steps: -1. Install [the `@astrojs/deno` adapter](https://github.com/withastro/astro/tree/main/packages/integrations/deno) to your project’s dependencies. +1. Install [the `@astrojs/deno` adapter](https://github.com/withastro/astro/tree/main/packages/integrations/deno) to your project’s dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal: ```bash npm install @astrojs/deno From 554be9c6adc18aca6e3644989da73f4c21a37bf4 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Thu, 1 Sep 2022 17:39:20 -0300 Subject: [PATCH 7/8] any package manager --- src/pages/en/guides/deploy/cloudflare.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/en/guides/deploy/cloudflare.md b/src/pages/en/guides/deploy/cloudflare.md index ec70a1a63ecbd..260951a633267 100644 --- a/src/pages/en/guides/deploy/cloudflare.md +++ b/src/pages/en/guides/deploy/cloudflare.md @@ -74,7 +74,7 @@ npx astro add cloudflare If you prefer to install the adapter manually instead, complete the following two steps: -1. Add the `@astrojs/cloudflare` adapter to your project's `package.json` by running: +1. Add the `@astrojs/cloudflare` adapter to your project's dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal: ```bash npm install @astrojs/cloudflare From a7d9959f207010d8bdbd47cd05e4d0f304d421ea Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Thu, 1 Sep 2022 19:32:39 -0300 Subject: [PATCH 8/8] extra space Co-authored-by: Yan Thomas <61414485+Yan-Thomas@users.noreply.github.com> --- src/pages/en/guides/server-side-rendering.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/en/guides/server-side-rendering.md b/src/pages/en/guides/server-side-rendering.md index 7d7cef964dee6..7a0d1e235441b 100644 --- a/src/pages/en/guides/server-side-rendering.md +++ b/src/pages/en/guides/server-side-rendering.md @@ -33,7 +33,7 @@ npx astro add netlify You can also add an adapter manually by installing the package and updating `astro.config.mjs` yourself. (See the links above for adapter-specific instructions to complete the following two steps to enable SSR.) Using `my-adapter` as an example placeholder, the instructions will look something like: -1. Install the adapter to your project dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal: +1. Install the adapter to your project dependencies using your preferred package manager. If you’re using npm or aren’t sure, run this in the terminal: ```bash npm install @astrojs/my-adapter