Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Database] Using Hub Database with Nuxt 3 Layers issues #497

Open
serhii-chernenko opened this issue Mar 13, 2025 · 0 comments
Open

[Database] Using Hub Database with Nuxt 3 Layers issues #497

serhii-chernenko opened this issue Mar 13, 2025 · 0 comments
Labels
bug Something isn't working

Comments

@serhii-chernenko
Copy link

Describe the bug

Prehistory

I have a demo application that uses Hub/Cloudflare KV storage to display just a list with up to 5 items:

The app architecture is pretty similar to a real app I'm developing. I've already decided I'm ready going forward with a real database.

First of all, I asked about supporting of multiple DBs and found out it's not ready yet #488.

After conversation with @RihanArfan I'm fine for now to have the only DB. I'm just tracking this opened issue #179. But I strictly need the layers architecture.

Progress

I followed the documentation and prepared changes for migration. Sadly, but nothing works.

Issues

[Solved] D1_ERROR

The issue was similar to this one #486.
But it happened because I have remote: true option but I didn't have any DBs in Cloudflare.
The issue has solved by:

npx nuxthub deploy --preview src/apps/app

When the _hub_migration DB is created remotely, the issue was gone.

Items are not loaded without any errors

When I run my app

npm run dev:app

I don't have any errors in my Terminal or in Console and Network tabs of DevTools but I just see a message:

Something went wrong...

Image
Image

Related files:

Seed task

I read in the docs the the seed task is optional but I guessed that issue that the items DB is not created yet, I have to seed it.

I prepared a task file:
https://github.com/serhii-chernenko/nuxthub-issue/pull/1/files#diff-d646e716751b7f6342a89af5575e4814cdc6c2c8d447eb1c77a64fdc63f86f00

But when I run it, I have just:

Internal server error

Image

Stack trace:

{
  "url": "/_nitro/tasks/seed",
  "statusCode": 500,
  "statusMessage": "",
  "message": "internal server error",
  "stack": "<pre><span class=\"stack internal\">at createError (/Users/inevix/dev/main/nuxthub-issue/node_modules/h3/dist/index.mjs:72:15)</span>\n<span class=\"stack internal\">at handleProxyError$1 (/Users/inevix/dev/main/nuxthub-issue/node_modules/@nuxthub/core/dist/runtime/database/server/utils/database.js:88:9)</span>\n<span class=\"stack internal\">at process.processTicksAndRejections (node:internal/process/task_queues:95:5)</span>\n<span class=\"stack internal\">at D1PreparedQuery.get (/Users/inevix/dev/main/nuxthub-issue/node_modules/src/d1/session.ts:223:16)</span>\n<span class=\"stack\">at insert (/Users/inevix/dev/main/nuxthub-issue/src/layers/core/data/server/utils/items.ts:32:1)</span>\n<span class=\"stack\">at Object.run (/Users/inevix/dev/main/nuxthub-issue/src/layers/core/data/server/tasks/seed.ts:13:1)</span>\n<span class=\"stack internal\">at runTask (/Users/inevix/dev/main/nuxthub-issue/node_modules/nitropack/dist/runtime/internal/task.mjs:37:17)</span>\n<span class=\"stack internal\">at Object.handler (/Users/inevix/dev/main/nuxthub-issue/node_modules/nitropack/dist/presets/_nitro/runtime/nitro-dev.mjs:70:12)</span>\n<span class=\"stack internal\">at async /Users/inevix/dev/main/nuxthub-issue/node_modules/h3/dist/index.mjs:1988:19</span>\n<span class=\"stack internal\">at async Object.callAsync (/Users/inevix/dev/main/nuxthub-issue/node_modules/unctx/dist/index.mjs:72:16)</span></pre>"
}

Steps to reproduce

  1. Clone the repo with the branch feature/drizzle:
    https://github.com/serhii-chernenko/nuxthub-issue/tree/feature/drizzle
git clone [email protected]:serhii-chernenko/nuxthub-issue.git
cd $_
git checkout feature/drizzle
  1. Install NPM packages
npm run install
  1. Go to NuxtHub Dashboard and create a new empty project:
    https://admin.hub.nuxt.com/username/new/project
  2. Go back to the terminal and link the created project
npx nuxthub link
  1. NuxtHub CLI doesn't support link apps, so, just move a created .env file manually:
mv .env src/apps/app/
  1. Make sure that D1 is enabled in your Cloudflare account:
    https://dash.cloudflare.com/account-id/workers/d1
  2. Deploy the app.
npx nuxthub deploy src/apps/app
  1. Wait a few minutes after to allow Cloudflare and NuxtHub setup all DNS records and services.
    https://admin.hub.nuxt.com/username/project-name/settings/domains. When the https://project-name.nuxt.dev/ domain will be ready, then Database has to be available:
    https://admin.hub.nuxt.com/username/project-name/production/storage/database
  2. Run app
npm run dev:app
  1. Open http://localhost:3000/
  2. Check that the app doesn't have any errors but items are not fetched
  3. Run the seed task in the Nuxt DevTools
  4. Stop the app, run
npm run db:generate

and run the app again
14. Open the file

src/layers/core/data/nuxt.config.ts

and comment the line

remote: true

re-run the app

npm run dev:app
  1. Run the seed task again, get error
D1_ERROR: no such table: items: SQLITE_ERROR

I hope this detailed instruction help you to deeply understand the root cause of issues I have.

Expected behavior

I'm fine with waiting for supporting of multiple DBs. But this integration totally blocks my work and can't move forward with my project. I don't want to change my solution and ecosystem. But please, provide me detailed instructions how to solve those issues to proceed. I appreciate any help.

@serhii-chernenko serhii-chernenko added the bug Something isn't working label Mar 13, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant