Build Nuxt for CF Worker and postgre
Hello, I'm trying to deploy a nuxt 3 app on CF workers which use postgre module and even after using
...
compatibility_flags = [ "nodejs_compat" ] or compatibility_flags = ["nodejs_compat_v2"] in the wrangler.toml I hit the error :
Error: Cannot resolve "cloudflare:sockets" from "node_modules/.pnpm/[email protected]/node_modules/postgres/cf/polyfills.js" and externals are not allowed!
Error: Cannot resolve "cloudflare:sockets" from "node_modules/.pnpm/[email protected]/node_modules/postgres/cf/polyfills.js" and externals are not allowed!
Value in composable is empty
I have this line of code that stores the user info
```js
/composables/auth.ts
const user = ref<Form | null>(null);...
how to add ld+json scripts in nuxt3
in nuxt 2 i had these entries in my head in nuxt config
script: [
{
type: 'application/ld+json',...
Error is occurring immediately after initializing the project [solved✅]
could you help resolving this error?
disabling page transitions between subpages
so, I'm once again on a point where I need help with nuxt 😅
what I have:
a website project with simple page transitions
structure:
index...
multi-version rest api
Im using nuxt3 to serve my rest api. I have a new version of the client which consumes the API and would like to create a new 'version' of the api with some of the endpoints being the same, some being updated. The old clients still need to work so the original version needs to still be available.
I realise, I can just create a 'v2' folder and copy the handlers I need to change and then reference /v2/blah where I need the newer version... but is there an elegant way to handle this? e.g. can I create a 'V2' set that 'falls back' to the V1 handlers if no V2 handler exists? this would make it easier in the client (everything is v2)...
`non-preached-url` with `@vite-pwa/nuxt`
Hello,
I get
Uncaught (in promise) non-precached-url: non-precached-url :: [{"url":"/"}]
error when visiting my homepage....What causses the error `[GET] "/api/auth/user": 405 HTTP method is not allowed.`
```js
const sessionHeader = useRequestHeaders(["session"]);
const getCurrentUser = async (): Promise<any> => {
try {
const data = await $fetch("/api/auth/user", {...
SSR friendly usePreviousRoute()?
Say a visitor goes to a blog category page at
/cat/tutorials and then clicks on a blog post going to /article/hello. The can also reach to /article/hello from other categories like /cat/videos. Now I want to create breadcrumbs that would show Posts > Tutorials > Hello or Posts > Videos > Hello providing the use navigation path. There will also be a default one if a user directly accesses the article page. How would you go about that?
I was thinking maybe it is possible to access the from of the routeMiddleware?
```Javascript
<!-- the <Article> component -->
<script setup lang="ts">...pages with usefetch causes browser tab crash on fast (back/forward) actions
as the title says
pages with usefetch causes browser tab to crash on fast (back/forward) actions.
If the user goes back/forth very fast (approximately 4 times and more ) quickly the browser tab will crash....
this is only happening with pages that have usefetch.
...
Cant add tailwindcss to a fresh new nuxt
Steps to reproduce:
npx nuxi@latest init
npx nuxi@latest module add tailwindcss
And add it to the modules in nuxt config. And I have this error:...
$fetch sends a HTTP request from both client and server?
Can someone help me disable the duplicate requests $fetch is sending from my server? Ex if someone presses a button to trigger an api call, it will send a request from my servers’s ip and another from my client ip. This is causing my api to do double the work for no reason. I don’t want to have to disable SSR.
hydration error
```ts
<NuxtLink :to="isAuth() ? '/servers' : '/api/auth'" :external="!isAuth()">
<Button class="w-52 h-14 text-lg" variant="secondary">
<Icon name="mdi:view-dashboard" size="25px" />
Dashboard...
"async-component-wrapper-stub" testing
Hello.
A part of my component is:
```vue
<div
v-if="showSuggestions"...
Navigate to component in VSC
Going to definition of component actually points me to components.d.ts instead of the actual component file. I was trying to find what i was missing from navigating to the component code.
My intellisense is failing as well not sure if it's related but in my research i already set tsconfig with components alias since i have been running nuxt 4....
Prevent CSS minify / parsing?
Hi folks 👋 When Nuxt (Vite? Nitro?) parses and compresses my CSS—which makes heavy use of nesting, including nested
@container queries—it gets very confused and incorrectly groups some selectors together, sharing commands between them that should not be shared. (It all works fine in dev, but prod is where the less-than-smart minification kicks in.) I’ve tried so many flags in nuxt.config.ts to prevent this, but nothing actually works. Anyone know the magic trick to keep Nuxt’s damn hand off my CSS? 😅
```
Node 18.17.0
Nuxt 3.8.0-28284309.b3d3d7f4...data fetching
onMouted fetches every time i reroute to the main page but i only want it to run every time you reload any page
useFetch
why does useFetch not fetch my data from my nuxt api but $fetch does?
```ts
const fetchUser = async () => {
const { data: userData } = await useFetch<CustomUser | null>("/api/auth/status", { headers });...
VS Code HTML color highlighting missing
For some reason the color highlighting in my .vue files are not working anymore. If I hover over the component it gives me all the infos i expect from a component but it does not highlight it as a component in the html.
