You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/content/docs/1.getting-started/3.deploy.md
+48Lines changed: 48 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,6 +4,8 @@ navigation.title: Deploy
4
4
description: Learn how to host a full-stack Nuxt application with minimal configuration.
5
5
---
6
6
7
+
NuxtHub supports multiple cloud providers including Vercel, Cloudflare Workers, and any Node.js hosting platform. Each provider offers different storage options that NuxtHub automatically configures.
::important{title="Remote Bindings in Development"}
62
+
When you configure a Cloudflare binding ID (`databaseId`, `namespaceId`, `bucketName`, or `hyperdriveId`), NuxtHub automatically connects to your remote Cloudflare resources during local development. This uses Wrangler's [`getPlatformProxy`](https://developers.cloudflare.com/workers/wrangler/api/#getplatformproxy) to provide real bindings in dev mode.
63
+
64
+
Ensure `wrangler` is installed as a dev dependency: `npx nypm add -D wrangler`
65
+
::
66
+
59
67
::tip
60
68
See a working example at [onmax/repros/nuxthub-716](https://github.com/onmax/repros/tree/main/nuxthub-716) — deployed without a `wrangler.toml` file.
61
69
::
62
70
71
+
### Local-Only Development
72
+
73
+
If you prefer to use local storage during development and only connect to Cloudflare resources in production, use Nuxt's `$production` environment override. This pattern ensures binding IDs are only applied when building for production:
74
+
75
+
```ts [nuxt.config.ts]
76
+
exportdefaultdefineNuxtConfig({
77
+
hub: {
78
+
db: 'sqlite',
79
+
kv: true,
80
+
blob: true
81
+
},
82
+
// Only use remote bindings in production
83
+
$production: {
84
+
hub: {
85
+
db: {
86
+
dialect: 'sqlite',
87
+
driver: 'd1',
88
+
connection: { databaseId: '<database-id>' }
89
+
},
90
+
kv: {
91
+
driver: 'cloudflare-kv-binding',
92
+
namespaceId: '<kv-namespace-id>'
93
+
},
94
+
blob: {
95
+
driver: 'cloudflare-r2',
96
+
bucketName: '<bucket-name>'
97
+
}
98
+
}
99
+
}
100
+
})
101
+
```
102
+
103
+
With this configuration:
104
+
-**Development**: Uses local storage (SQLite file, filesystem) in `.data/` directory
105
+
-**Production**: Connects to your Cloudflare D1, KV, and R2 resources
106
+
107
+
::note
108
+
The `$production` override merges with your base config. You only need to specify the properties that differ in production.
109
+
::
110
+
63
111
### Deploy
64
112
65
113
Create a [Cloudflare Workers project](https://dash.cloudflare.com/?to=/:account/workers-and-pages/create) and link your GitHub or GitLab repository. NuxtHub auto-configures bindings from your `nuxt.config.ts` during build.
The `projectUrl` and `projectSecretKey` options have been removed. NuxtHub now auto-detects when you want to connect to remote Cloudflare bindings during local development.
100
+
101
+
When binding IDs are present in your config (e.g., `databaseId`, `namespaceId`, `bucketName`), NuxtHub will:
102
+
1. Detect the remote binding configuration
103
+
2. Show a warning about connecting to production resources
104
+
3. Generate a temporary `wrangler.toml` with `remote = true` for all bindings
For Cloudflare D1, configure the database ID in your `nuxt.config.ts` and NuxtHub auto-generates the wrangler bindings.
43
52
::
53
+
::warning
54
+
Configuring a `databaseId` connects to your remote Cloudflare D1 database during development. Use the [`$production` pattern](/docs/getting-started/deploy#local-only-development) to keep development local-only.
@@ -107,6 +115,10 @@ By default, if NuxtHub cannot detect a driver, files are stored locally in the `
107
115
Learn more about R2 bindings on Cloudflare's documentation.
108
116
::
109
117
118
+
::warning
119
+
Configuring a `bucketName` connects to your remote Cloudflare R2 bucket during development. Use the [`$production` pattern](/docs/getting-started/deploy#local-only-development) to keep development local-only.
120
+
::
121
+
110
122
::note
111
123
To use Cloudflare R2 without hosting on Cloudflare Workers, use the [Cloudflare R2 via S3 API](https://developers.cloudflare.com/r2/api/s3/api/).
Copy file name to clipboardExpand all lines: docs/content/docs/4.kv/1.index.md
+8Lines changed: 8 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -35,6 +35,10 @@ When building the Nuxt app, NuxtHub automatically configures the key-value stora
35
35
UPSTASH_REDIS_REST_TOKEN=...
36
36
```
37
37
38
+
::note
39
+
Setting these credentials locally connects to your remote Upstash Redis during development.
40
+
::
41
+
38
42
::tip
39
43
When deploying to Vercel, we automatically detect if `KV_REST_API_URL` and `KV_REST_API_TOKEN` environment variables are set, and use them to configure the Upstash Redis connection.
40
44
::
@@ -73,6 +77,10 @@ When building the Nuxt app, NuxtHub automatically configures the key-value stora
73
77
Learn more about KV bindings on Cloudflare's documentation.
74
78
::
75
79
80
+
::warning
81
+
Configuring a `namespaceId` connects to your remote Cloudflare KV namespace during development. Use the [`$production` pattern](/docs/getting-started/deploy#local-only-development) to keep development local-only.
Learn more about KV bindings on Cloudflare's documentation.
47
47
::
48
+
49
+
::warning
50
+
Configuring a `namespaceId` connects to your remote Cloudflare KV namespace during development. Use the [`$production` pattern](/docs/getting-started/deploy#local-only-development) to keep development local-only.
0 commit comments