github-featured/triggerdotdev--trigger.dev
2
0
Fork 0
Code Issues Pull Requests Deployments Models Agent Notes Packages Projects Releases Wiki Activity

Docs - sync vercel env vars (#1426)

Browse Source 
* Added sync env vars docs example

* Added links in the config + deploy files

* Updated copy

* Added vercel docs cards and added them to all of the relevant docs pages

* Added sync env vars to the intro page

* Added automatically sync env vars section to nextjs guide

* Added ‘Manually’

* Removed code block and updated title

* updated formatting and added vercelsyncenvvars to the config file

* Added missing comment

* Updated imports to /core

* Added sync env var docs link and note

* Improved the VERCEL_ACCESS_TOKEN note

* Added link to vercel

* Updated docs and improved formatting

* Copy tweaks

* Added space

* Updated deploy docs
This commit is contained in:
Dan
2024-11-04 14:55:10 +00:00
committed by GitHub
parent 6313db698a
commit aca2f54cb7
10 changed files with 223 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/config/config-file.mdx
+85 -21
View File
@@ -13,8 +13,8 @@ The `trigger.config.ts` file is used to configure your Trigger.dev project. It i
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//Your project ref (you can see it on the Project settings page in the dashboard)
project: "proj_gtcwttqhhtlasxgfuhxs",
// Your project ref (you can see it on the Project settings page in the dashboard)
project: "<project ref>",
//The paths for your trigger folders
dirs: ["./trigger"],
retries: {
@@ -55,7 +55,8 @@ You can add lifecycle functions to get notified when any task starts, succeeds,
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
onSuccess: async (payload, output, { ctx }) => {
console.log("Task succeeded", ctx.task.id);
},
@@ -87,7 +88,8 @@ import { PrismaInstrumentation } from "@prisma/instrumentation";
import { OpenAIInstrumentation } from "@traceloop/instrumentation-openai";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
instrumentations: [new PrismaInstrumentation(), new OpenAIInstrumentation()],
});
```
@@ -115,7 +117,8 @@ We currently only officially support the `node` runtime, but you can try our exp
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
runtime: "bun",
});
```
@@ -130,7 +133,8 @@ You can specify the default machine for all tasks in your project:
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
defaultMachine: "large-1x",
});
```
@@ -145,7 +149,8 @@ You can set the log level for your project:
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
logLevel: "debug",
});
```
@@ -160,7 +165,8 @@ You can set the default `maxDuration` for all tasks in your project:
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
maxDuration: 60, // 60 seconds
});
```
@@ -175,7 +181,8 @@ You can customize the build process using the `build` option:
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
// Don't bundle these packages
external: ["header-generator"],
@@ -197,7 +204,8 @@ All code is bundled by default, but you can exclude some packages from the bundl
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
external: ["header-generator"],
},
@@ -212,7 +220,8 @@ Each entry in the external should be a package name, not necessarily the import
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
external: ["ai"],
},
@@ -232,7 +241,8 @@ You can customize the `jsx` options that are passed to `esbuild` using the `jsx`
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
jsx: {
// Use the Fragment component instead of React.Fragment
@@ -258,7 +268,8 @@ You can add custom [import conditions](https://esbuild.github.io/api/#conditions
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
conditions: ["react-server"],
},
@@ -282,7 +293,8 @@ import { defineConfig } from "@trigger.dev/sdk/v3";
import { additionalFiles } from "@trigger.dev/build/extensions/core";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
extensions: [
additionalFiles({ files: ["wrangler/wrangler.toml", "./assets/**", "./fonts/**"] }),
@@ -304,7 +316,8 @@ import { defineConfig } from "@trigger.dev/sdk/v3";
import { additionalPackages } from "@trigger.dev/build/extensions/core";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
extensions: [additionalPackages({ packages: ["wrangler"] })],
},
@@ -317,7 +330,8 @@ This allows you to include additional packages in the build that are not automat
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
extensions: [additionalPackages({ packages: ["wrangler@1.19.0"] })],
},
@@ -334,6 +348,7 @@ import { emitDecoratorMetadata } from "@trigger.dev/build/extensions/typescript"
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [emitDecoratorMetadata()],
},
@@ -365,6 +380,8 @@ import { defineConfig } from "@trigger.dev/sdk/v3";
import { prismaExtension } from "@trigger.dev/build/extensions/prisma";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [
prismaExtension({
@@ -389,6 +406,7 @@ import { prismaExtension } from "@trigger.dev/build/extensions/prisma";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [
prismaExtension({
@@ -431,6 +449,7 @@ import { prismaExtension } from "@trigger.dev/build/extensions/prisma";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [
prismaExtension({
@@ -451,6 +470,7 @@ import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [
prismaExtension({
@@ -473,6 +493,43 @@ These environment variables are only used during the build process and are not e
The `syncEnvVars` build extension replaces the deprecated `resolveEnvVars` export. Check out our [syncEnvVars documentation](/deploy-environment-variables#sync-env-vars-from-another-service) for more information.
```ts
import { syncEnvVars } from "@trigger.dev/build/extensions/core";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [syncEnvVars()],
},
});
```
#### vercelSyncEnvVars
The `vercelSyncEnvVars` build extension syncs environment variables from your Vercel project to Trigger.dev.
<Note>
You need to set the `VERCEL_ACCESS_TOKEN` and `VERCEL_PROJECT_ID` environment variables, or pass
in the token and project ID as arguments to the `vercelSyncEnvVars` build extension. You can find
/ generate the `VERCEL_ACCESS_TOKEN` in your Vercel
[dashboard](https://vercel.com/account/settings/tokens). Make sure the scope of the token covers
the project you want to sync.
</Note>
```ts
import { defineConfig } from "@trigger.dev/sdk/v3";
import { vercelSyncEnvVars } from "@trigger.dev/build/extensions/core";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [vercelSyncEnvVars()],
},
});
```
#### audioWaveform
Previously, we installed [Audio Waveform](https://github.com/bbc/audiowaveform) in the build image. That's been moved to a build extension:
@@ -482,7 +539,8 @@ import { defineConfig } from "@trigger.dev/sdk/v3";
import { audioWaveform } from "@trigger.dev/build/extensions/audioWaveform";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
extensions: [audioWaveform()], // uses verson 1.1.0 of audiowaveform by default
},
@@ -525,6 +583,7 @@ import { defineConfig } from "@trigger.dev/sdk/v3";
import { ffmpeg } from "@trigger.dev/build/extensions/core";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [ffmpeg()],
@@ -539,7 +598,8 @@ import { defineConfig } from "@trigger.dev/sdk/v3";
import { ffmpeg } from "@trigger.dev/build/extensions/core";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
extensions: [ffmpeg({ version: "6.0-4" })],
},
@@ -561,6 +621,7 @@ import { sentryEsbuildPlugin } from "@sentry/esbuild-plugin";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [
esbuildPlugin(
@@ -586,7 +647,8 @@ import { defineConfig } from "@trigger.dev/sdk/v3";
import { aptGet } from "@trigger.dev/build/extensions/core";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
extensions: [aptGet({ packages: ["ffmpeg"] })],
},
@@ -599,7 +661,8 @@ If you want to install a specific version of a package, you can specify the vers
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
extensions: [aptGet({ packages: ["ffmpeg=6.0-4"] })],
},
@@ -646,7 +709,8 @@ Instead of creating this function and worrying about types, you can define an ex
import { defineConfig } from "@trigger.dev/sdk/v3";
export default defineConfig({
//..other stuff
project: "<project ref>",
// Your other config settings...
build: {
extensions: [
{
docs/deploy-environment-variables.mdx
+4
View File
@@ -123,6 +123,10 @@ export default defineConfig({
});
```
#### Syncing environment variables from Vercel
To sync environment variables from your Vercel projects to Trigger.dev, you can use our build extension. Check out our [syncing environment variables from Vercel guide](/guides/examples/vercel-sync-env-vars).
#### Deploy
When you run the [CLI deploy command](/cli-deploy) directly or using [GitHub Actions](/github-actions) it will sync the environment variables from [Infisical](https://infisical.com) to Trigger.dev. This means they'll appear on the Environment Variables page so you can confirm that it's worked.
docs/guides/examples/vercel-ai-sdk.mdx
+4
View File
@@ -4,6 +4,8 @@ sidebarTitle: "Vercel AI SDK"
description: "This example demonstrates how to use the Vercel AI SDK with Trigger.dev."
---
import VercelDocsCards from "/snippets/vercel-docs-cards.mdx";
## Overview
The [Vercel AI SDK](https://www.npmjs.com/package/ai) is a simple way to use AI models from many different providers, including OpenAI, Microsoft Azure, Google Generative AI, Anthropic, Amazon Bedrock, Groq, Perplexity and [more](https://sdk.vercel.ai/providers/ai-sdk-providers).
@@ -51,3 +53,5 @@ To test this task in the dashboard, you can use the following payload:
"prompt": "What is the meaning of life?"
}
```
<VercelDocsCards />
docs/guides/examples/vercel-sync-env-vars.mdx
+53
View File
@@ -0,0 +1,53 @@
---
title: "Syncing environment variables from your Vercel projects"
sidebarTitle: "Vercel sync environment variables"
description: "This example demonstrates how to sync environment variables from your Vercel project to Trigger.dev."
---
import VercelDocsCards from "/snippets/vercel-docs-cards.mdx";
## Overview
This example shows how to automatically sync environment variables from your Vercel project to Trigger.dev.
## Build configuration
To sync environment variables, you just need to add our build extension to your `trigger.config.ts` file. This extension will then automatically run every time you deploy your Trigger.dev project.
<Note>
You need to set the `VERCEL_ACCESS_TOKEN` and `VERCEL_PROJECT_ID` environment variables in the
Trigger.dev dashboard, or pass in the token and project ID as arguments to the `vercelSyncEnvVars`
build extension. You can find / generate the `VERCEL_ACCESS_TOKEN` in your Vercel
[dashboard](https://vercel.com/account/settings/tokens). Make sure the scope of the token covers
the project with the environment variables you want to sync.
</Note>
```ts trigger.config.ts
import { defineConfig } from "@trigger.dev/sdk/v3";
import { vercelSyncEnvVars } from "@trigger.dev/build/extensions/core";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
// Add the vercelSyncEnvVars build extension
extensions: [vercelSyncEnvVars()],
},
});
```
<Note>
[Build extensions](/config/config-file#extensions) allow you to hook into the build system and
customize the build process or the resulting bundle and container image (in the case of
deploying). You can use pre-built extensions or create your own.
</Note>
## Running the sync operation
To sync the environment variables, all you need to do is run our `deploy` command. You should see some output in the console indicating that the environment variables have been synced, and they should now be available in your Trigger.dev dashboard.
```bash
npx trigger.dev@latest deploy
```
<VercelDocsCards />
docs/guides/frameworks/nextjs-webhooks.mdx
+4
View File
@@ -4,6 +4,8 @@ sidebarTitle: "Next.js webhooks"
description: "Learn how to trigger a task from a webhook in a Next.js app."
---
import VercelDocsCards from "/snippets/vercel-docs-cards.mdx";
## Prerequisites
- [A Next.js project, set up with Trigger.dev](/guides/frameworks/nextjs)
@@ -135,3 +137,5 @@ If you now go to your [Trigger.dev dashboard](https://cloud.trigger.dev), you sh
</Step>
</Steps>
<VercelDocsCards />
docs/guides/frameworks/nextjs.mdx
+35 -13
View File
@@ -17,6 +17,7 @@ import NextjsTroubleshootingButtonSyntax from "/snippets/nextjs-button-syntax.md
import WorkerFailedToStartWhenRunningDevCommand from "/snippets/worker-failed-to-start.mdx";
import AddEnvironmentVariables from "/snippets/add-environment-variables.mdx";
import DeployingYourTask from "/snippets/deplopying-your-task.mdx";
import VercelDocsCards from "/snippets/vercel-docs-cards.mdx";
<Note>This guide can be followed for both App and Pages router as well as Server Actions.</Note>
@@ -244,16 +245,42 @@ Here are the steps to trigger your task in the Next.js App and Pages router and
</Tabs>
## Automatically sync environment variables from your Vercel project (optional)
If you want to automatically sync environment variables from your Vercel project to Trigger.dev, you can add our `vercelSyncEnvVars` build extension to your `trigger.config.ts` file.
<Note>
You need to set the `VERCEL_ACCESS_TOKEN` and `VERCEL_PROJECT_ID` environment variables, or pass
in the token and project ID as arguments to the `vercelSyncEnvVars` build extension. You can find
/ generate the `VERCEL_ACCESS_TOKEN` in your Vercel
[dashboard](https://vercel.com/account/settings/tokens). Make sure the scope of the token covers
the project you want to sync.
</Note>
```ts trigger.config.ts
import { defineConfig } from "@trigger.dev/sdk/v3";
import { vercelSyncEnvVars } from "@trigger.dev/build/extensions/core";
export default defineConfig({
project: "<project ref>",
// Your other config settings...
build: {
extensions: [vercelSyncEnvVars()],
},
});
```
<Note>
For more information, see our [Vercel sync environment
variables](/guides/examples/vercel-sync-env-vars) guide.
</Note>
<AddEnvironmentVariables />
<DeployingYourTask />
## Troubleshooting & extra resources
<NextjsTroubleshootingMissingApiKey/>
<NextjsTroubleshootingButtonSyntax/>
<WorkerFailedToStartWhenRunningDevCommand/>
### Revalidation from your Trigger.dev tasks
[Revalidation](https://vercel.com/docs/incremental-static-regeneration/quickstart#on-demand-revalidation) allows you to purge the cache for an ISR route. To revalidate an ISR route from a Trigger.dev task, you have to set up a handler for the `revalidate` event. This is an API route that you can add to your Next.js app.
@@ -398,14 +425,9 @@ You can test your revalidation task in the Trigger.dev dashboard on the testing
}
```
## Additional resources for Next.js
<Card
title="Next.js - triggering tasks using webhooks"
icon="N"
href="/guides/frameworks/nextjs-webhooks"
>
How to create a webhook handler in a Next.js app, and trigger a task from it.
</Card>
<NextjsTroubleshootingMissingApiKey/>
<NextjsTroubleshootingButtonSyntax/>
<WorkerFailedToStartWhenRunningDevCommand/>
<VercelDocsCards />
<UsefulNextSteps />
docs/guides/introduction.mdx
+1
View File
@@ -55,6 +55,7 @@ Tasks you can copy and paste to get started with Trigger.dev. They can all be ex
| [Supabase database operations](/guides/examples/supabase-database-operations) | Run basic CRUD operations on a table in a Supabase database using Trigger.dev. |
| [Supabase Storage upload](/guides/examples/supabase-storage-upload) | Download a video from a URL and upload it to Supabase Storage using S3. |
| [Vercel AI SDK](/guides/examples/vercel-ai-sdk) | Use Vercel AI SDK to generate text using OpenAI. |
| [Vercel sync environment variables](/guides/examples/vercel-sync-env-vars) | Automatically sync environment variables from your Vercel projects to Trigger.dev. |
<Note>
If you would like to see a guide for your framework, or an example task for your use case, please
docs/mint.json
+2 -1
View File
@@ -342,7 +342,8 @@
"guides/examples/supabase-storage-upload",
"guides/examples/react-pdf",
"guides/examples/resend-email-sequence",
"guides/examples/vercel-ai-sdk"
"guides/examples/vercel-ai-sdk",
"guides/examples/vercel-sync-env-vars"
]
},
{
docs/snippets/add-environment-variables.mdx
+2 -2
View File
@@ -1,4 +1,4 @@
## Add your environment variables (optional)
## Manually add your environment variables (optional)
If you have any environment variables in your tasks, be sure to add them in the dashboard so deployed code runs successfully. In Node.js, these environment variables are accessed in your code using `process.env.MY_ENV_VAR`.
@@ -8,4 +8,4 @@ button. ![Environment variables page](/images/environment-variables-page.jpg)
You can add values for your local dev environment, staging and prod. ![Environment variables
page](/images/environment-variables-panel.jpg)
You can also add environment variables in code by following the steps on the [Environment Variables page](/deploy-environment-variables#in-your-code).
You can also add environment variables in code by following the steps on the [Environment Variables page](/deploy-environment-variables#in-your-code).
docs/snippets/vercel-docs-cards.mdx
+33
View File
@@ -0,0 +1,33 @@
## Learn more about Vercel and Trigger.dev
### Walk-through guides from development to deployment
<CardGroup cols={2}>
<Card title="Next.js - setup guide" icon="N" href="/guides/frameworks/nextjs">
Learn how to setup Trigger.dev with Next.js, using either the pages or app router.
</Card>
<Card
title="Next.js - triggering tasks using webhooks"
icon="N"
href="/guides/frameworks/nextjs-webhooks"
>
Learn how to create a webhook handler for incoming webhooks in a Next.js app, and trigger a task from it.
</Card>
</CardGroup>
### Task examples
<CardGroup cols={2}>
<Card
title="Vercel sync environment variables"
icon="code"
href="/guides/examples/vercel-sync-env-vars"
>
Learn how to automatically sync environment variables from your Vercel projects to Trigger.dev.
</Card>
<Card title="Vercel AI SDK" icon="code" href="/guides/examples/vercel-ai-sdk">
Learn how to use the Vercel AI SDK, which is a simple way to use AI models from different
providers, including OpenAI, Anthropic, Amazon Bedrock, Groq, Perplexity etc.
</Card>
</CardGroup>