Hendrik Jan Comments - Answer Overflow

Topics

Hendrik Jan

•Created by Hendrik Jan on 7/2/2024 in #❓・help

Error "currentRenderingInstance is null" since upgrade of Nuxt

A bit more info: the error only happens the first time after the nodejs server is reloaded. I've set ssr:false so it's not a hydration problem. Als the problem is only in dev mode, not when building.

5 replies

•Created by Hendrik Jan on 7/2/2024 in #❓・help

Error "currentRenderingInstance is null" since upgrade of Nuxt

I still didn't find a solution, but it seems to be centered around nuxt/i18n and our Docker setup.

5 replies

•Created by Hendrik Jan on 7/2/2024 in #❓・help

Error "currentRenderingInstance is null" since upgrade of Nuxt

Unfortunately I've already tried all those options. Also tried to delete the .nuxt folder, nothing fixes my problem yet :-(.

5 replies

•Created by Hendrik Jan on 5/27/2024 in #❓・help

How to configure "~" alias when working with Docker?

"compilerOptions": {
    "paths": {
      "~/*": ["./*"],
      "~~/*": ["./*"],
    }
}

"compilerOptions": {
    "paths": {
      "~/*": ["./*"],
      "~~/*": ["./*"],
    }
}

Now VSCode understands where to look for ~/assets and so on.

3 replies

•Created by Hendrik Jan on 5/27/2024 in #❓・help

How to configure "~" alias when working with Docker?

I seem to have found a solution. The tsconfig.json option "paths" actually uses relative paths, so they will work both inside Docker and outside Docker. Added this to my tsconfig.json:

3 replies

•Created by whatstaz on 4/3/2024 in #❓・help

Where to fetch initial user data

You could try it in "app.vue" (you probably have to create that file, see the docs). Simplified example of my code (I'm using Nuxt useState as you can see):

// app.vue
<template>
  <NuxtLayout>
    <NuxtPage />
  </NuxtLayout>
</template>

<script setup lang="ts">
const userData = useState('user');

const data = await useFetch(...);
userData.value = data.value.user;
</script>

// app.vue
<template>
  <NuxtLayout>
    <NuxtPage />
  </NuxtLayout>
</template>

<script setup lang="ts">
const userData = useState('user');

const data = await useFetch(...);
userData.value = data.value.user;
</script>

10 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

In case someone else wants to solve a similar problem, here is a working reproduction with some accompanying text: https://stackblitz.com/edit/github-o9ivmk-qkcdj8?file=app.vue

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

:-).

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

I changed "lazy:true" to "lazy:false", zo the data is ready right away as I understand it.

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

When I click the refresh-button I first see "[0,1,2]" (which I think is rendered on the server) and after a fraction of a second this is changed to "[0,1,2,3,4,5,6,7,8,9]", so it seems to work.

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

Oh, is seems to do it for me. What is wrong do you think?

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

https://stackblitz.com/edit/github-o9ivmk-fsdbrw?file=composables%2FuseTwoStepFetch.ts

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

I think I'll be able to get this working in the non-simplified version at work :-).

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

Oh, I think I'm getting at it. If is set server:false, lazy:false for the second useFetch(), the useFetch() will be run twice (once on server, once on client), but the first (on server) returns "null" and the second (on client) return "[3,4,5,6,7,8,9]".

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

$fetch doesn't deduplicate so the call could potentially happen both on the server and in the client, which I don't want.

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

Oh, wait, you are using $fetch -- but then, can I be sure this will only be run in the client?

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

Actually your example also has lazy:true same as mine -- or am I looking at the wrong place?

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

I'll have to make a study about this. I see the change you made, but it will need some time for me to understand 😅 .

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

Ah, I'll have to read about lazy in the documentation once again then. Thank you so much for taking time to answer.

15 replies

•Created by Hendrik Jan on 3/31/2024 in #❓・help

Can you use useFetch twice in one composable, once on server, once in client?

I guess you are right in that, but I don't really understand how to do it different. Isn't the await (before the second useFetch() making sure that we are waiting until the data is ready? I try to have the first part of my composable to take place on the server and the second part to take place on the client. I also tried hooks, but to no avail yet.

15 replies