From e431da858244bd62929903af5dbc9b4885869744 Mon Sep 17 00:00:00 2001 From: Christian Preston Date: Thu, 29 Feb 2024 12:23:24 -0500 Subject: [PATCH 1/7] docs: improve formatting & use new undocs componets --- docs/2.deploy/20.providers/alwaysdata.md | 2 + docs/2.deploy/20.providers/aws-amplify.md | 5 +- docs/2.deploy/20.providers/aws.md | 3 + docs/2.deploy/20.providers/azure.md | 11 ++- docs/2.deploy/20.providers/cleavr.md | 2 +- docs/2.deploy/20.providers/cloudflare.md | 49 ++++++------- docs/2.deploy/20.providers/deno-deploy.md | 6 +- docs/2.deploy/20.providers/digitalocean.md | 1 - docs/2.deploy/20.providers/firebase.md | 38 ++++------ docs/2.deploy/20.providers/flightcontrol.md | 58 +++++++-------- docs/2.deploy/20.providers/github-pages.md | 2 +- docs/2.deploy/20.providers/heroku.md | 23 +++--- docs/2.deploy/20.providers/iis.md | 12 ++-- docs/2.deploy/20.providers/koyeb.md | 78 +++++++++++---------- docs/2.deploy/20.providers/render.md | 18 ++--- docs/2.deploy/20.providers/stormkit.md | 1 - docs/2.deploy/20.providers/vercel.md | 12 ++-- 17 files changed, 156 insertions(+), 165 deletions(-) diff --git a/docs/2.deploy/20.providers/alwaysdata.md b/docs/2.deploy/20.providers/alwaysdata.md index 8d4c90ae0a..b3e2322670 100644 --- a/docs/2.deploy/20.providers/alwaysdata.md +++ b/docs/2.deploy/20.providers/alwaysdata.md @@ -29,9 +29,11 @@ - *Command*: `node ./output/server/index.mjs` - *Working directory*: `www/my-app` (adapt it to your deployment path) - *Environment*: + ```ini NITRO_PRESET=alwaysdata ``` + - *Node.js version*: `Default version` is fine; pick no less than `20.0.0` (you can also [set your Node.js version globally](https://help.alwaysdata.com/en/languages/nodejs/configuration/#supported-versions)) - *Hot restart*: `SIGHUP` diff --git a/docs/2.deploy/20.providers/aws-amplify.md b/docs/2.deploy/20.providers/aws-amplify.md index a030d0a0d3..c024db4ce0 100644 --- a/docs/2.deploy/20.providers/aws-amplify.md +++ b/docs/2.deploy/20.providers/aws-amplify.md @@ -19,12 +19,12 @@ Integration with this provider is possible with [zero configuration](/deploy/#ze 5. Optionally, select Enable SSR logging to enable server-side logging to your Amazon CloudWatch account 6. Confirm configuration and click on "Save and Deploy" - ## Advanced Configuration You can configure advanced options of this preset using `awsAmplify` option. ::code-group + ```ts [nitro.config.ts] export default defineNitroConfig({ awsAmplify: { @@ -46,6 +46,7 @@ export default defineNuxtConfig({ } }) ``` + :: ### `amplify.yml` @@ -53,6 +54,7 @@ export default defineNuxtConfig({ You might need a custom `amplify.yml` file for advanced configuration. Here are two template examples: ::code-group + ```yml [amplify.yml] version: 1 frontend: @@ -89,4 +91,5 @@ applications: buildPath: / appRoot: apps/website1 ``` + :: diff --git a/docs/2.deploy/20.providers/aws.md b/docs/2.deploy/20.providers/aws.md index 7b00cadc1e..a730e03ae1 100644 --- a/docs/2.deploy/20.providers/aws.md +++ b/docs/2.deploy/20.providers/aws.md @@ -23,11 +23,13 @@ const { statusCode, headers, body } = handler({ rawPath: '/' }) Nitro output, by default uses dynamic chunks for lazy loading code only when needed. However this sometimes can not be ideal for performance. (See discussions in [unjs/nitro#650](https://github.com/unjs/nitro/pull/650)). You can enabling chunk inlining behavior using [`inlineDynamicImports`](/config#inlinedynamicimports) config. ::code-group + ```ts [nitro.config.ts] export default defineNitroConfig({ inlineDynamicImports: true }); ``` + ```ts [nuxt.config.ts] export default defineNuxtConfig({ nitro: { @@ -35,4 +37,5 @@ export default defineNuxtConfig({ } }) ``` + :: diff --git a/docs/2.deploy/20.providers/azure.md b/docs/2.deploy/20.providers/azure.md index ca33888ffc..9cc141cf4b 100644 --- a/docs/2.deploy/20.providers/azure.md +++ b/docs/2.deploy/20.providers/azure.md @@ -21,7 +21,7 @@ Install [Azure Functions Core Tools](https://docs.microsoft.com/en-us/azure/azur You can invoke a development environment to preview before deploying. ```bash -NITRO_PRESET=azure yarn build +NITRO_PRESET=azure npx nypm@latest build npx @azure/static-web-apps-cli start .output/public --api-location .output/server ``` @@ -58,9 +58,7 @@ When you are asked to select your framework, select custom and provide the follo If you miss this step, you can always find the build configuration section in your workflow and update the build configuration: -```yaml -# .github/workflows/azure-static-web-apps-.yml - +```yaml [.github/workflows/azure-static-web-apps-.yml] ###### Repository/Build Configurations ###### app_location: '/' api_location: '.output/server' @@ -88,7 +86,7 @@ Install [Azure Functions Core Tools](https://docs.microsoft.com/en-us/azure/azur You can invoke a development environment from the serverless directory. ```bash -NITRO_PRESET=azure_functions yarn build +NITRO_PRESET=azure_functions npx nypm@latest build cd .output func start ``` @@ -112,8 +110,7 @@ First, obtain your Azure Functions Publish Profile and add it as a secret to you Then create the following file as a workflow: -```yaml -# .github/workflows/azure.yml +```yaml [.github/workflows/azure.yml] name: azure on: push: diff --git a/docs/2.deploy/20.providers/cleavr.md b/docs/2.deploy/20.providers/cleavr.md index 0540728b85..5cc4f032e5 100644 --- a/docs/2.deploy/20.providers/cleavr.md +++ b/docs/2.deploy/20.providers/cleavr.md @@ -10,7 +10,6 @@ Integration with this provider is possible with [zero configuration](/deploy/#zero-config-providers). :: - ## Set up your web app In your project, set Nitro preset to `cleavr`. @@ -22,6 +21,7 @@ export default { } } ``` + Push changes to your code repository. **In your Cleavr panel:** diff --git a/docs/2.deploy/20.providers/cloudflare.md b/docs/2.deploy/20.providers/cloudflare.md index ad6f38f660..b2eb822702 100644 --- a/docs/2.deploy/20.providers/cloudflare.md +++ b/docs/2.deploy/20.providers/cloudflare.md @@ -16,7 +16,6 @@ This is the recommended preset for Cloudflare deployments, please consider using Integration with this provider is possible with zero configuration. :: - Nitro automatically generates a `_routes.json` file that controls which routes get served from files and which are served from the Worker script. The auto-generated routes file can be overridden with the config option `cloudflare.pages.routes` ([read more](https://developers.cloudflare.com/pages/platform/functions/routing/#functions-invocation-routes)). ### Building your Application using the preset @@ -28,49 +27,43 @@ If you use the [Cloudflare Pages GitHub/GitLab integration](https://developers.c If instead you want preview your application locally and/or manually deploy it, when building the application you will need to let Nitro know that the target environment is the Cloudflare Pages one, you can do that in two ways: 1. By defining either the `NITRO_PRESET` or the `SERVER_PRESET` environment variable set to `cloudflare-pages` when running the build process, like so: -```bash -NITRO_PRESET=cloudflare-pages npm run build -``` + + ```bash + NITRO_PRESET=cloudflare-pages npm run build + ``` 1. Or by updating your Nitro [preset configuration](/config#preset): -```json5 -"preset": "cloudflare-pages", -``` + + ```json5 + "preset": "cloudflare-pages", + ``` + and then running the standard build command: -```bash -npm run build -``` + +:pm-run{script="build"} ### Wrangler To preview your application locally or manually deploy it you will need to use the [wrangler](https://github.com/cloudflare/workers-sdk/tree/main/packages/wrangler) CLI tool, simply install it as a node dependency: -```bash -npm i wrangler -``` +:pm-install{name="wrangler"} ### Preview your app locally After having built your application you can preview it locally with wrangler by running: -```bash -npx wrangler pages dev dist -``` +:pm-x{command="wrangler pages dev dist"} ### Deploy from your local machine using wrangler After having built your application you can manually deploy it with wrangler, in order to do so first make sure to be logged into your Cloudflare account: -```bash -npx wrangler login -``` +:pm-x{command="wrangler login"} Then you can deploy the application with: -```bash -npx wrangler pages deploy dist -``` +:pm-x{command="wrangler pages deploy dist"} ## Cloudflare Module Workers @@ -145,9 +138,7 @@ npx wrangler dev .output/server/index.mjs --site .output/public and publish it: -```bash -npx wrangler deploy -``` +:pm-x{command="npx wrangler deploy"} ## Cloudflare Service Workers @@ -206,7 +197,6 @@ SECRET="top-secret" **Note:** Make sure you add `.env` to the `.gitignore` file so that you don't commit it as it can contain sensitive information. :: - ### Specify Variables for local previews After build, when you try out your project locally with `wrangler dev` or `wrangler pages dev`, in order to have access to environment variables you will need to specify the in a `.dev.vars` file in the root of your project (as presented in the [Pages](https://developers.cloudflare.com/pages/functions/bindings/#interact-with-your-environment-variables-locally) and [Workers](https://developers.cloudflare.com/workers/configuration/environment-variables/#interact-with-environment-variables-locally) documentation). @@ -217,7 +207,6 @@ If you are using a `.env` file while developing, your `.dev.vars` should be iden **Note:** Make sure you add `.dev.vars` to the `.gitignore` file so that you don't commit it as it can contain sensitive information. :: - ### Specify Variables for Production For production, use the cloudflare dashboard or the [`wrangler secret`](https://developers.cloudflare.com/workers/wrangler/commands/#secret) command to set environment variables and secrets. @@ -281,6 +270,7 @@ In order to access bindings during local dev mode, regardless of the chosen pres > The `nitro-cloudflare-dev` module is experimental. The Nitro team is looking into a more native integration which could in the near future make the module unneeded. In order to access bindings in dev mode we start by defining the bindings in a `wrangler.toml` file, this is for example how you would define a variable and a KV namespace: + ```ini [wrangler.toml] [vars] MY_VARIABLE="my-value" @@ -291,7 +281,7 @@ id = "xxx" ``` > [!NOTE] -> Only bindings in the default environment are recognized. +> Only bindings in the default environment are recognized. Next we install the `nitro-cloudflare-dev` module as well as the required `wrangler` package (if not already installed): @@ -300,6 +290,7 @@ Next we install the `nitro-cloudflare-dev` module as well as the required `wrang Then define module: ::code-group + ```js [nitro.config.js] import nitroCloudflareBindings from "nitro-cloudflare-dev"; @@ -307,11 +298,13 @@ export default defineNitroConfig({ modules: [nitroCloudflareBindings], }); ``` + ```ts [nuxt.config.ts] export default defineNuxtConfig({ modules: ['nitro-cloudflare-dev'] }) ``` + :: From this moment, when running diff --git a/docs/2.deploy/20.providers/deno-deploy.md b/docs/2.deploy/20.providers/deno-deploy.md index 6b40f1486a..22e1a19d69 100644 --- a/docs/2.deploy/20.providers/deno-deploy.md +++ b/docs/2.deploy/20.providers/deno-deploy.md @@ -25,11 +25,11 @@ deployctl deploy --project=my-project server/index.ts You just need to include the deployctl GitHub Action as a step in your workflow. -You do not need to set up any secrets for this to work. You do need to link your GitHub repository to your Deno Deploy project and choose the "GitHub Actions" deployment mode. You can do this in your project settings on https://dash.deno.com. +You do not need to set up any secrets for this to work. You do need to link your GitHub repository to your Deno Deploy project and choose the "GitHub Actions" deployment mode. You can do this in your project settings on [here](https://dash.deno.com) -Create `.github/workflows/deno_deploy.yml`: +Create the following workflow file in your `.github/workflows` directory: -```yaml +```yaml [.github/workflows/deno_deploy.yml] name: deno-deploy on: diff --git a/docs/2.deploy/20.providers/digitalocean.md b/docs/2.deploy/20.providers/digitalocean.md index a2080f47dd..bed0411098 100644 --- a/docs/2.deploy/20.providers/digitalocean.md +++ b/docs/2.deploy/20.providers/digitalocean.md @@ -30,7 +30,6 @@ [See more information](https://docs.digitalocean.com/products/app-platform/languages-frameworks/nodejs/#node-version). - 1. You'll also need to add a run command so Digital Ocean knows what command to run after a build. You can do so by adding a start script to your `package.json`: ```json diff --git a/docs/2.deploy/20.providers/firebase.md b/docs/2.deploy/20.providers/firebase.md index 9dd59b2a2a..b9ff93f848 100644 --- a/docs/2.deploy/20.providers/firebase.md +++ b/docs/2.deploy/20.providers/firebase.md @@ -79,29 +79,13 @@ This file is usually generated when you initialize your project with the Firebas Then, add Firebase dependencies to your project: -::code-group -```bash [npm] -npm install -D firebase-admin firebase-functions firebase-functions-test -``` -```bash [yarn] -yarn add --dev firebase-admin firebase-functions firebase-functions-test -``` -```bash [pnpm] -pnpm install -D firebase-admin firebase-functions firebase-functions-test -``` -```bash [bun] -bun add -D firebase-admin firebase-functions firebase-functions-test -``` -:: +:pm-install{name="firebase-admin firebase-functions firebase-functions-test" dev} #### 3. Log into the firebase CLI Make sure you are authenticated with the firebase cli. Run this command and follow the prompts: -```bash -npx firebase-tools login -``` - +:pm-x{command="firebase-tools login"} ## Local preview @@ -112,7 +96,7 @@ NITRO_PRESET=firebase npm run build firebase emulators:start ``` -## Build and dploy +## Build and deploy Deploy to Firebase Hosting by running a Nitro build and then running the `firebase deploy` command. @@ -120,9 +104,7 @@ Deploy to Firebase Hosting by running a Nitro build and then running the `fireba NITRO_PRESET=firebase npm run build ``` -```bash -npx firebase-tools deploy -``` +:pm-x{command="firebase-tools deploy"} If you installed the Firebase CLI globally, you can also run: @@ -137,6 +119,7 @@ firebase deploy To switch to the more recent and, recommended generation of firebase functions, set the `firebase.gen` option to `2`: ::code-group + ```ts{3} [nitro.config.ts] export default defineNitroConfig({ firebase: { @@ -145,6 +128,7 @@ export default defineNitroConfig({ } }) ``` + ```ts{4} [nuxt.config.ts] export default defineNuxtConfig({ nitro: { @@ -155,6 +139,7 @@ export default defineNuxtConfig({ } }) ``` + :: ::note @@ -168,6 +153,7 @@ If you already have a deployed version of your website and want to upgrade to 2n You can set options for the firebase functions in your `nitro.config.ts` file: ::code-group + ```ts [nitro.config.ts] export default defineNitroConfig({ firebase: { @@ -193,6 +179,7 @@ export default defineNuxtConfig({ }, }); ``` + :: You can also set options for 1st generation Cloud Functions if the `gen` option is set to `1`. Note these are different from the options for 2nd generation Cloud Functions. @@ -202,6 +189,7 @@ You can also set options for 1st generation Cloud Functions if the `gen` option You can set custom Node.js version in configuration: ::code-group + ```ts [nitro.config.ts] export default defineNitroConfig({ firebase: { @@ -219,6 +207,7 @@ export default defineNuxtConfig({ }, }); ``` + :: Firebase tools use the `engines.node` version in `package.json` to determine which node version to use for your functions. Nitro automatically writes to the `.output/server/package.json` with configured Node.js version. @@ -254,15 +243,15 @@ your functions. You can specify a new name for the deployed Firebase function in your configuration: ::code-group -```ts [nitro.config.ts] -import { defineNitroConfig } from 'nitropack/config' +```ts [nitro.config.ts] export default defineNitroConfig({ firebase: { serverFunctionName: "" } }) ``` + ```ts [nuxt.config.ts] export default defineNuxtConfig({ nitro: { @@ -272,4 +261,5 @@ export default defineNuxtConfig({ } }) ``` + :: diff --git a/docs/2.deploy/20.providers/flightcontrol.md b/docs/2.deploy/20.providers/flightcontrol.md index 98d90d3595..9dbf49bdd9 100644 --- a/docs/2.deploy/20.providers/flightcontrol.md +++ b/docs/2.deploy/20.providers/flightcontrol.md @@ -10,7 +10,7 @@ Flightcontrol has zero config support for [Nuxt](https://nuxt.com/) projects. :: -### Set Up your flightcontrol account +## Set Up your flightcontrol account On a high level, the steps you will need to follow to deploy a project for the first time are: @@ -34,34 +34,34 @@ On a high level, the steps you will need to follow to deploy a project for the f 2. Select the `flightcontrol.json` config type. 3. Add a new file at the root of your repository called `flightcontrol.json`. Here is an example configuration that creates an AWS fargate service for your app: -```json -{ - "$schema": "https://app.flightcontrol.dev/schema.json", - "environments": [ - { - "id": "production", - "name": "Production", - "region": "us-west-2", - "source": { - "branch": "main" - }, - "services": [ - { - "id": "nitro", - "buildType": "nixpacks", - "name": "My Nitro site", - "type": "fargate", - "domain": "www.yourdomain.com", - "outputDirectory": ".output", - "startCommand": "node .output/server/index.mjs", - "cpu": 0.25, - "memory": 0.5 - } - ] - } - ] -} -``` + ```json [flightcontrol.json] + { + "$schema": "https://app.flightcontrol.dev/schema.json", + "environments": [ + { + "id": "production", + "name": "Production", + "region": "us-west-2", + "source": { + "branch": "main" + }, + "services": [ + { + "id": "nitro", + "buildType": "nixpacks", + "name": "My Nitro site", + "type": "fargate", + "domain": "www.yourdomain.com", + "outputDirectory": ".output", + "startCommand": "node .output/server/index.mjs", + "cpu": 0.25, + "memory": 0.5 + } + ] + } + ] + } + ``` 4. Submit the new project form. diff --git a/docs/2.deploy/20.providers/github-pages.md b/docs/2.deploy/20.providers/github-pages.md index 9ab4dd31f0..b176568982 100644 --- a/docs/2.deploy/20.providers/github-pages.md +++ b/docs/2.deploy/20.providers/github-pages.md @@ -14,7 +14,7 @@ Follow the steps to [create a GitHub Pages site](https://docs.github.com/en/page Here is an example GitHub Actions workflow to deploy your site to GitHub Pages using the `github_pages` preset: -```yaml +```yaml [.github/workflows/deploy.yml] # https://github.com/actions/deploy-pages#usage name: Deploy to GitHub Pages diff --git a/docs/2.deploy/20.providers/heroku.md b/docs/2.deploy/20.providers/heroku.md index 154570d656..08e7696b8c 100644 --- a/docs/2.deploy/20.providers/heroku.md +++ b/docs/2.deploy/20.providers/heroku.md @@ -35,7 +35,6 @@ } ``` - ## With nginx 1. Add the heroku Nginx buildpack [here](https://github.com/heroku/heroku-buildpack-nginx.git) @@ -53,21 +52,26 @@ Step 1: Listen on a socket at 'tmp/nginx.socket' Step 2: Create a file '/tmp/app-initialized' when your app is ready to accept connections -1. Create custom app runner, eg: apprunner.mjs at the root of the project (or any other prefered location), in this file, create a server, using the listener generated by the node preset, then listen on the socket as detailed in the buildpack doc +1. Create custom app runner, eg: apprunner.mjs at the root of the project (or any other preferred location), in this file, create a server, using the listener generated by the node preset, then listen on the socket as detailed in the buildpack doc - ```js + ```ts import { createServer } from 'node:http' - import {listener} from './.output/server/index.mjs' + import { listener } from './.output/server/index.mjs' + const server = createServer(listener) + server.listen('/tmp/nginx.socket') //following the buildpack doc ``` -1. To create the 'tmp/app-initialized' file, use a nitro plugin, create file 'initServer.ts' at the root of the project (or any other prefered location) +1. To create the 'tmp/app-initialized' file, use a nitro plugin, create file 'initServer.ts' at the root of the project (or any other preferred location) - ```js + ```ts import fs from "fs" + export default defineNitroPlugin((nitroApp) => { - if((process.env.NODE_ENV || 'development') != 'development')fs.openSync('/tmp/app-initialized', 'w') + if((process.env.NODE_ENV || 'development') != 'development') { + fs.openSync('/tmp/app-initialized', 'w') + } }) ``` @@ -75,7 +79,4 @@ web: bin/start-nginx node apprunner.mjs -1. Bonus: create file 'config/nginx.conf.erb' to customize your nginx config. With the node preset, by default, static files handlers will not be generated, you can use nginx to server static files, just add the right location rule to the server block(s), or, force the node preset to generate handlers for the static files by setting serveStatic to true - - - +1. Bonus: create file 'config/nginx.conf.erb' to customize your nginx config. With the node preset, by default, static files handlers will not be generated, you can use nginx to server static files, just add the right location rule to the server block(s), or, force the node preset to generate handlers for the static files by setting serveStatic to true. diff --git a/docs/2.deploy/20.providers/iis.md b/docs/2.deploy/20.providers/iis.md index 98f799a193..84d857eca0 100644 --- a/docs/2.deploy/20.providers/iis.md +++ b/docs/2.deploy/20.providers/iis.md @@ -7,10 +7,10 @@ **Preset:** `iis_node` 1. Install the latest LTS version of [Node.js](https://nodejs.org/en/) on your Windows Server. -1. Install [IISnode](https://github.com/azure/iisnode/releases) -2. Install [IIS `URLRewrite` Module](https://www.iis.net/downloads/microsoft/url-rewrite). -3. In IIS, add `.mjs` as a new mime type and set its content type to `application/javascript`. -4. Deploy the contents of your `.output` folder to your website in IIS. +2. Install [IISnode](https://github.com/azure/iisnode/releases) +3. Install [IIS `URLRewrite` Module](https://www.iis.net/downloads/microsoft/url-rewrite). +4. In IIS, add `.mjs` as a new mime type and set its content type to `application/javascript`. +5. Deploy the contents of your `.output` folder to your website in IIS. ## Using IIS handler @@ -30,7 +30,7 @@ You can use IIS http handler directly. export default defineNitroConfig({ // IIS options default iis: { - // merges in a pre-exisiting web.config file to the nitro default file + // merges in a pre-existing web.config file to the nitro default file mergeConfig: true, // overrides the default nitro web.config file all together overrideConfig: false, @@ -43,7 +43,7 @@ export default defineNuxtConfig({ nitro: { // IIS options default iis: { - // merges in a pre-exisiting web.config file to the nitro default file + // merges in a pre-existing web.config file to the nitro default file mergeConfig: true, // overrides the default nitro web.config file all together overrideConfig: false, diff --git a/docs/2.deploy/20.providers/koyeb.md b/docs/2.deploy/20.providers/koyeb.md index 036a7f03cf..355f6e7a04 100644 --- a/docs/2.deploy/20.providers/koyeb.md +++ b/docs/2.deploy/20.providers/koyeb.md @@ -8,15 +8,16 @@ ## Using the control panel - 1. In the [Koyeb control panel](https://app.koyeb.com/), click **Create App**. 2. Choose **GitHub** as your deployment method. 3. Choose the GitHub **repository** and **branch** containing your application code. 4. Name your Service. 5. If you did not add a `start` command to your `package.json` file, under the **Build and deployment settings**, toggle the override switch associated with the run command field. In the **Run command** field, enter: + ```bash node .output/server/index.mjs` ``` + 6. In the **Advanced** section, click **Add Variable** and add a `NITRO_PRESET` variable set to `koyeb`. 7. Name the App. 8. Click the **Deploy** button. @@ -26,11 +27,14 @@ 1. Follow the instructions targeting your operating system to [install the Koyeb CLI client](https://www.koyeb.com/docs/cli/installation) with an installer. Alternatively, visit the [releases page on GitHub](https://github.com/koyeb/koyeb-cli/releases) to directly download required files. 2. Create a Koyeb API access token by visiting the [API settings for your organization](https://app.koyeb.com/settings/api) in the Koyeb control panel. 3. Log into your account with the Koyeb CLI by typing: + ```bash koyeb login ``` + Paste your API credentials when prompted. 4. Deploy your Nitro application from a GitHub repository with the following command. Be sure to substitute your own values for ``, ``, and ``: + ```bash koyeb app init \ --git github.com// \ @@ -46,45 +50,45 @@ 1. Create a `.dockerignore` file in the root of your project and add the following lines: -```docker -Dockerfile -.dockerignore -node_modules -npm-debug.log -.nitro -.output -.git -dist -README.md -``` + ```plaintext + Dockerfile + .dockerignore + node_modules + npm-debug.log + .nitro + .output + .git + dist + README.md + ``` 2. Add a `Dockerfile` to the root of your project: -```ini -FROM node:18-alpine AS base - -FROM base AS deps -RUN apk add --no-cache libc6-compat -WORKDIR /app -COPY package.json package-lock.json ./ -RUN npm ci - -FROM base AS builder -WORKDIR /app -COPY --from=deps /app/node_modules ./node_modules -COPY . . -RUN npm run build && npm cache clean --force - -FROM base AS runner -WORKDIR /app -RUN addgroup --system --gid 1001 nodejs -RUN adduser --system --uid 1001 nitro -COPY --from=builder /app . -USER nitro -EXPOSE 3000 -ENV PORT 3000 -CMD ["npm", "run", "start"] -``` + ```docker + FROM node:18-alpine AS base + + FROM base AS deps + RUN apk add --no-cache libc6-compat + WORKDIR /app + COPY package.json package-lock.json ./ + RUN npm ci + + FROM base AS builder + WORKDIR /app + COPY --from=deps /app/node_modules ./node_modules + COPY . . + RUN npm run build && npm cache clean --force + + FROM base AS runner + WORKDIR /app + RUN addgroup --system --gid 1001 nodejs + RUN adduser --system --uid 1001 nitro + COPY --from=builder /app . + USER nitro + EXPOSE 3000 + ENV PORT 3000 + CMD ["npm", "run", "start"] + ``` The Dockerfile above provides the minimum requirements to run the Nitro application. You can easily extend it depending on your needs. You will then need to push your Docker image to a registry. You can use [Docker Hub](https://hub.docker.com/) or [GitHub Container Registry](https://docs.github.com/en/packages/guides/about-github-container-registry) for example. diff --git a/docs/2.deploy/20.providers/render.md b/docs/2.deploy/20.providers/render.md index 7581dd9af2..a5af69da4e 100644 --- a/docs/2.deploy/20.providers/render.md +++ b/docs/2.deploy/20.providers/render.md @@ -9,20 +9,16 @@ ## Set up application 1. [Create a new Web Service](https://dashboard.render.com/select-repo?type=web) and select the repository that contains your code. - -1. Ensure the 'Node' environment is selected. - -1. Depending on your package manager, set the build command to `yarn && yarn build`, `npm install && npm run build`, or `pnpm i --shamefully-hoist && pnpm build`. - -1. Update the start command to `node .output/server/index.mjs` - -1. Click 'Advanced' and add an environment variable with `NITRO_PRESET` set to `render_com`. You may also need to add a `NODE_VERSION` environment variable set to `18` for the build to succeed ([docs](https://render.com/docs/node-version)). - -1. Click 'Create Web Service'. +2. Ensure the 'Node' environment is selected. +3. Depending on your package manager, set the build command to `yarn && yarn build`, `npm install && npm run build`, or `pnpm i --shamefully-hoist && pnpm build`. +4. Update the start command to `node .output/server/index.mjs` +5. Click 'Advanced' and add an environment variable with `NITRO_PRESET` set to `render_com`. You may also need to add a `NODE_VERSION` environment variable set to `18` for the build to succeed ([docs](https://render.com/docs/node-version)). +6. Click 'Create Web Service'. ## Infrastructure as Code (IaC) 1. Create a file called `render.yaml` with following content at the root of your repository. + > This file followed by [Infrastructure as Code](https://render.com/docs/infrastructure-as-code) on Render ```yaml @@ -37,7 +33,7 @@ services: - key: NITRO_PRESET value: render_com ``` -2. [Create a new Blueprint Instance](https://dashboard.render.com/select-repo?type=blueprint) and select the repository containing your `render.yaml` file. +1. [Create a new Blueprint Instance](https://dashboard.render.com/select-repo?type=blueprint) and select the repository containing your `render.yaml` file. You should be good to go! diff --git a/docs/2.deploy/20.providers/stormkit.md b/docs/2.deploy/20.providers/stormkit.md index 12c0c8bec2..d5ea812da9 100644 --- a/docs/2.deploy/20.providers/stormkit.md +++ b/docs/2.deploy/20.providers/stormkit.md @@ -21,4 +21,3 @@ Follow the steps to [create a new app](https://app.stormkit.io/apps/new) on Stor By default, Stormkit will deploy your apps automatically when you push changes to your main branch. But to trigger a manual deploy (for example, you might do this for the very first deployment), you may click `Deploy now`. ![Trigger a manual deploy with Deploy Now](/images/stormkit-deploy.png) - diff --git a/docs/2.deploy/20.providers/vercel.md b/docs/2.deploy/20.providers/vercel.md index ca49d008e4..4b1dc2e9b5 100644 --- a/docs/2.deploy/20.providers/vercel.md +++ b/docs/2.deploy/20.providers/vercel.md @@ -27,7 +27,6 @@ Monorepo is supported by Vercel. However a custom "[Root Directory](https://verc Examples of values for "Root Directory": `apps/web` or `packages/app`. - ## Vercel edge functions **Preset:** `vercel_edge` @@ -36,7 +35,6 @@ Examples of values for "Root Directory": `apps/web` or `packages/app`. It is possible to deploy your nitro applications directly on [Vercel Edge Functions](https://vercel.com/docs/concepts/functions/edge-functions). - In order to enable this target, please set `NITRO_PRESET` environment variable to `vercel_edge`. ## Vercel KV storage @@ -60,6 +58,7 @@ This feature is currently in beta. Please check [driver docs](https://unstorage. Update your configuration: ::code-group + ```ts [nitro.config.ts] export default defineNitroConfig({ storage: { @@ -67,6 +66,7 @@ export default defineNitroConfig({ } }) ``` + ```ts [nuxt.config.ts] export default defineNuxtConfig({ nitro: { @@ -76,6 +76,7 @@ export default defineNuxtConfig({ } }) ``` + :: ::note @@ -113,11 +114,12 @@ On-demand revalidation allows you to purge the cache for an ISR route whenever y To revalidate a page on demand: 1. Create an Environment Variable which will store a revalidation secret - * You can use the command `openssl rand -base64 32` or https://generate-secret.vercel.app/32 to generate a random value. + - You can use the command `openssl rand -base64 32` or [Generate a Secret](https://generate-secret.vercel.app/32) to generate a random value. 2. Update your configuration: ::code-group + ```ts [nitro.config.ts] export default defineNitroConfig({ vercel: { @@ -127,6 +129,7 @@ To revalidate a page on demand: } }) ``` + ```ts [nuxt.config.ts] export default defineNuxtConfig({ nitro: { @@ -138,6 +141,7 @@ To revalidate a page on demand: } }) ``` + :: -3. To trigger "On-Demand Incremental Static Regeneration (ISR)" and revalidate a path to a Prerender Function, make a GET or HEAD request to that path with a header of x-prerender-revalidate: . When that Prerender Function endpoint is accessed with this header set, the cache will be revalidated. The next request to that function should return a fresh response. +3. To trigger "On-Demand Incremental Static Regeneration (ISR)" and revalidate a path to a Prerender Function, make a GET or HEAD request to that path with a header of x-prerender-revalidate: `bypassToken`. When that Prerender Function endpoint is accessed with this header set, the cache will be revalidated. The next request to that function should return a fresh response. From 60fe9f600bf46bbe645377a6690e53c177941bec Mon Sep 17 00:00:00 2001 From: Christian Preston Date: Fri, 1 Mar 2024 09:47:40 -0500 Subject: [PATCH 2/7] chore: resolve --- docs/2.deploy/20.providers/deno-deploy.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/2.deploy/20.providers/deno-deploy.md b/docs/2.deploy/20.providers/deno-deploy.md index 22e1a19d69..f86f1e1c49 100644 --- a/docs/2.deploy/20.providers/deno-deploy.md +++ b/docs/2.deploy/20.providers/deno-deploy.md @@ -25,7 +25,7 @@ deployctl deploy --project=my-project server/index.ts You just need to include the deployctl GitHub Action as a step in your workflow. -You do not need to set up any secrets for this to work. You do need to link your GitHub repository to your Deno Deploy project and choose the "GitHub Actions" deployment mode. You can do this in your project settings on [here](https://dash.deno.com) +You do not need to set up any secrets for this to work. You do need to link your GitHub repository to your Deno Deploy project and choose the "GitHub Actions" deployment mode. You can do this in your project settings on https://dash.deno.com Create the following workflow file in your `.github/workflows` directory: From 0d3be5bcbffcbd89d9a1183672f2735804c7ad5e Mon Sep 17 00:00:00 2001 From: Christian Preston Date: Fri, 1 Mar 2024 10:46:34 -0500 Subject: [PATCH 3/7] chore: resolve change --- docs/2.deploy/20.providers/deno-deploy.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/2.deploy/20.providers/deno-deploy.md b/docs/2.deploy/20.providers/deno-deploy.md index f86f1e1c49..cbfd6387c4 100644 --- a/docs/2.deploy/20.providers/deno-deploy.md +++ b/docs/2.deploy/20.providers/deno-deploy.md @@ -25,7 +25,7 @@ deployctl deploy --project=my-project server/index.ts You just need to include the deployctl GitHub Action as a step in your workflow. -You do not need to set up any secrets for this to work. You do need to link your GitHub repository to your Deno Deploy project and choose the "GitHub Actions" deployment mode. You can do this in your project settings on https://dash.deno.com +You do not need to set up any secrets for this to work. You do need to link your GitHub repository to your Deno Deploy project and choose the "GitHub Actions" deployment mode. You can do this in your project settings on [Deno Deploy](https://dash.deno.com). Create the following workflow file in your `.github/workflows` directory: From 9cc8dce36cabeb899c37320a4e17d3243b7014e9 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Sun, 3 Mar 2024 15:41:44 +0100 Subject: [PATCH 4/7] koyeb: remove docker lang as undocs does not supports it --- docs/2.deploy/20.providers/koyeb.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/2.deploy/20.providers/koyeb.md b/docs/2.deploy/20.providers/koyeb.md index 355f6e7a04..718da76ec2 100644 --- a/docs/2.deploy/20.providers/koyeb.md +++ b/docs/2.deploy/20.providers/koyeb.md @@ -64,7 +64,7 @@ 2. Add a `Dockerfile` to the root of your project: - ```docker + ``` FROM node:18-alpine AS base FROM base AS deps From b8b2f9120a28446fc523ff996842453c0b467300 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Sun, 3 Mar 2024 15:45:51 +0100 Subject: [PATCH 5/7] Update docs/2.deploy/20.providers/cloudflare.md --- docs/2.deploy/20.providers/cloudflare.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/2.deploy/20.providers/cloudflare.md b/docs/2.deploy/20.providers/cloudflare.md index baa93dc0d8..1f67649fdf 100644 --- a/docs/2.deploy/20.providers/cloudflare.md +++ b/docs/2.deploy/20.providers/cloudflare.md @@ -138,7 +138,7 @@ npx wrangler dev .output/server/index.mjs --site .output/public and publish it: -:pm-x{command="npx wrangler deploy"} +:pm-x{command="wrangler deploy"} ## Cloudflare Service Workers From 0af99e2efa20ecb6918e1931cddfd7ba9592f57b Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Sun, 3 Mar 2024 15:47:51 +0100 Subject: [PATCH 6/7] Update docs/2.deploy/20.providers/koyeb.md --- docs/2.deploy/20.providers/koyeb.md | 1 - 1 file changed, 1 deletion(-) diff --git a/docs/2.deploy/20.providers/koyeb.md b/docs/2.deploy/20.providers/koyeb.md index 718da76ec2..3dcbe6c2c9 100644 --- a/docs/2.deploy/20.providers/koyeb.md +++ b/docs/2.deploy/20.providers/koyeb.md @@ -50,7 +50,6 @@ 1. Create a `.dockerignore` file in the root of your project and add the following lines: - ```plaintext Dockerfile .dockerignore node_modules From 1815b20ab7677328e81a652a4cfc45459bce38ec Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Sun, 3 Mar 2024 15:48:30 +0100 Subject: [PATCH 7/7] fix block --- docs/2.deploy/20.providers/koyeb.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/2.deploy/20.providers/koyeb.md b/docs/2.deploy/20.providers/koyeb.md index 3dcbe6c2c9..0ae515c543 100644 --- a/docs/2.deploy/20.providers/koyeb.md +++ b/docs/2.deploy/20.providers/koyeb.md @@ -50,6 +50,7 @@ 1. Create a `.dockerignore` file in the root of your project and add the following lines: + ``` Dockerfile .dockerignore node_modules