lkjimy
lkjimy
NNuxt
Created by Anto' on 3/8/2024 in #❓・help
Nuxt build faileld using image in css sheet
You can ditch the @ and just start with /, which will point to /public automatically. Make sure your public assets are in the /public folder, like @svreenen said. On the public folder: https://nuxt.com/docs/guide/directory-structure/public Docs on difference between assets and public folders: https://nuxt.com/docs/getting-started/assets#public-directory
3 replies
NNuxt
Created by lkjimy on 3/7/2024 in #❓・help
How to prevent hydration issues when using the route query to change UI elements and fetch data?
I found this issue, not sure if it is related https://github.com/nuxt/nuxt.com/issues/1455 (🤔 I'll save this here as reference for later) https://github.com/nuxt/nuxt.com/blob/main/composables/useShowcase.ts
10 replies
NNuxt
Created by lkjimy on 3/7/2024 in #❓・help
How to prevent hydration issues when using the route query to change UI elements and fetch data?
The real thing is a bit more complicated, but here it is: https://stackblitz.com/edit/nuxt-starter-fwapu3?file=components%2FMyHeader.vue
10 replies
NNuxt
Created by lkjimy on 3/7/2024 in #❓・help
How to prevent hydration issues when using the route query to change UI elements and fetch data?
Sure, I'll get back to you soon
10 replies
NNuxt
Created by lkjimy on 3/7/2024 in #❓・help
How to prevent hydration issues when using the route query to change UI elements and fetch data?
I created a composable to keep the logic for these object conversions. The page has a watcher that listens to route.query (with immediate: true), and populates the state (used by UI elements) with data from route.query. What I observed is that the page is initially rendered with UI elements' default values, and in a second, changed to the current query.
10 replies
NNuxt
Created by lkjimy on 3/7/2024 in #❓・help
How to prevent hydration issues when using the route query to change UI elements and fetch data?
Maybe I'm missing something on how to properly build this. So, the order of operations is just as I described: 1. Get the URL query object using a computed on route.query. 2. Populating the state used by UI elements with the data from the route query (in which the user will interact with, to change the search parameters). 3. Converting the route query object into an object that will be used to call the API to fetch the data. So, Nuxt gives me hydration errors related to those UI elements that got changed on step 2.
10 replies