🐛 Bug Report: Appwrite CLI throws error when using Nuxt 3

[davidschubert]

👟 Reproduction steps

Environment
"nuxt": "^3.5.2"
"appwrite": "^11.0.0",

Can't really reproduction the problem. Because you can't install the Appwrite CLI on Stackblitz or Codesandbox.

Appwrite CLI:
https://appwrite.io/docs/command-line

and you need a simple appwrite account and project to init it.

---

There is a bug in the combination of Nuxt 3 and Appwrite. If you start with a normal Nuxt 3 App and some Appwrite commands. Then everything works fine!

The bug starts when you start to use the Appwrite CLI and use the following command "appwrite init project" and init the project you are working on. After this, the app is not working anymore and gives me always an 500 error.

👍 Expected behavior

that everything works fine like before the "appwrite init project".

👎 Actual Behavior

The bug starts when you start to use the Appwrite CLI and use the following command "appwrite init project" and init the project you are working on. After this, the app is not working anymore and gives me always an 500 error:

500
__vite_ssr_import_1__.Client is not a constructor

at _sfc_main.setup (./pages/health/index.js:81:23)
at callWithErrorHandling (./node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:156:18)
at setupStatefulComponent (./node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:7190:25)
at setupComponent (./node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:7151:36)
at renderComponentVNode (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:614:15)
at renderVNode (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:743:14)
at renderComponentSubTree (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:698:7)
at renderComponentVNode (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:631:12)
at renderVNode (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:743:14)

🎲 Appwrite version

Appwrite Cloud

💻 Operating system

MacOS

🧱 Your Environment

Local Environment
"nuxt": "^3.5.2"
"appwrite": "^11.0.0",

👀 Have you spent some time to check if this issue has been raised before?

• I checked and didn't find similar issue

🏢 Have you read the Code of Conduct?

• I have read the Code of Conduct

[davidschubert]

i found a solution. i need to put the new Client function in a onBeforeMount Lifecycle Hook. Does anybody has a answer why?

onBeforeMount(() => {
    client.value = new Client();
    client.value
        .setEndpoint("https://cloud.appwrite.io/v1")
        .setProject("***");

    account.value = new Account(client.value);
});

[davidschubert]

Appwrite vite SSR import

I would guess that there might be an issue with ssr and appwrite. It would be worth investigating and updating the appwrite template, either way.

[davidschubert]

nuxt/nuxt#21510

[Haimantika]

Thanks for raising this issue @davidschubert . @Meldiron is there a way to solve it?

[TorstenDittmann]

How do you actually import the Client?

[joeyouss]

Hi @davidschubert, could you provide us with more information about this? Nonetheless, we are also having an internal discussion regarding this!