Fabian B.
Explore posts from serversVSCode Typechecking very slow: Takes up to 20s
Hi there! I noticed that in a larger Nuxt project (using layers with pnpm monorepo packages), the type checking became very slow. I notice this when I for example hover over a config object in
nuxt.config.ts. It takes up to 20s to load that type definition. For that time, VSCode displays loading. Same for dependencies in TS files. If I write a function and add a dependency, it takes up to 20s to get the error of missing dependency to go away.
It's hard to reproduce because it only appears on larger projects. I noticed that once the type definition is loaded, hovering it then is displaying it instantly.
Does anybody have the same issue? And any tips on how to debug intellisense performance, and if it's a Nuxt or Volar issue? Thanks 🙂2 replies
Reactive Route Search Query Composable
Does somebody have deeper experience with this?
I am trying to implement a composable to reactively use a route search query. Meaning that the value updates reactively whenever the route query parameter changes. And when setting a new value with
.value, it does a navigateTo() in the background.
However, there are issues with SSR, which makes it hard to implement this. This is how I got so far:
Works in most cases, but in the case where I do a navigateTo() in any component (or the user is navigating back & forth) where certain query parameters are getting removed (e.g. from ?foo=bar&xyz=abc to ?foo=bar), it's still not reactive (watching the searchQuery value reacts to changes in the query parameters, not not when it gets removed e.g. from the user navigating back & forth).3 replies
DTDrizzle Team
•Created by Fabian B. on 2/14/2024 in #help
How do I write a subquery inside select?
I have this SQL which is doing what I want
The query selection representation for this would be
which also works. But I need a representation in a normal select query. I am trying to wrap my head around this, but it just does not seem to work. So far I got this, but not sure if I am on the right path here. I don't see how I can select from the subquery in
allJobTypesManual.
Thanks in advance!2 replies
NNovu
•Created by Fabian B. on 1/25/2024 in #💬│support
Workflows: Dynamically provide custom email template
Hi there! I want to build a workflow where I digest a few events and then send out an email with a list of those.
I use Brevo (Sendinblue) to send these emails.
I would like to either create the email templates
1. using Brevo (https://developers.brevo.com/docs/send-a-transactional-email#creating-your-api-request-using-brevo-api-clients)
2. or generate them by myself by feeding react-email/vue-email (which renders to html) with the events data and then send this email.
Is there currently a way of doing this?
14 replies
DTDrizzle Team
•Created by Fabian B. on 1/15/2024 in #help
type "GEOMETRY(POINT)" does not exist
Hi there! I try to use PostGIS with drizzle and having a hard time. I try to run the following migration file
But it errors with
Even though PostGIS is setuped successfully. When I run this SQL in supabase directly, it correctly adds the new column with the special data type.
I'm not the only one: https://github.com/drizzle-team/drizzle-orm/issues/1315
Maybe someone has an idea, would be grateful!
12 replies
DTDrizzle Team
•Created by Fabian B. on 8/27/2023 in #help
on every `migrate()`: schema "drizzle" already exists, skipping
Hi there! I have setuped a postgres DB. Everytime I call migrate(), it works and migrates, but returns these two warnings:
Does anyone have an idea on why this happens and how I can stop it from happening? Clogs up my console 😄 Thanks!
--
I am using [email protected], [email protected], [email protected]
11 replies
Getting the name of the currently active layout inside a component
I want to get the name of the current active layout in some component. So that I can do things like
if (layout === 'xxx') { ... }.
Since I am defining it in definePageMeta in the page's component, maybe there is a composable that I can use to retrieve the layout name inside a child component.1 replies
Cannot find module `...@nuxt/devtools`
Hi there. I just installed a fresh new project with
nuxi init. I wanted to npm i, but it returns the following error:
The problem is, I do not even have installed node 16. I only have node 18.16.1. So why does nuxt require a path with a node version I don't have installed?
I used node 16 before, but this was a long time ago. I tried to remove and reinstall nvm, node, pnpm from my system, but that didn't help.4 replies
DTDrizzle Team
•Created by Fabian B. on 5/22/2023 in #help
`where` inside relational queries `with` does not work
Hi there! I'm new to drizzle and tried out the relational queries.
I want to do a nested
where rule inside a with relation. But doing it is giving me type errors (Object literal may only specify known properties, and where does not exist in type) and it's just ignored by the orm.
Maybe someone knows what I am doing wrong and why I don't get the option to do a where. Thanks in advance!
My query:
My schema (simplified):
9 replies
Create local Nuxt modules inside a Nuxt project: Do I need a build step?
Hey there! Question to all that worked with modules, especially local ones:
I want to create some modules that will live only locally inside my nuxt project. I have done that by creating a
modules/my-module/module.ts and modules/my-module/runtime/plugin.ts like you would get from the module starter template. I am using the module in my main app like:
This works so far.
My question:
Now I want to install some dependencies and also inject some types from this module into my main app. Normally you would have "prepack": "nuxt-module-build", in your package.json which would generate some dist/...mjs files. Is this needed when my module is locally installed directly inside a nuxt app? Or can I get types and dependencies to work without that.7 replies
Tips for Common Pitfalls (`$fetch` vs `useFetch`, `public` vs `assets`)
Just a note for all, since these questions comes in here regularly.
$fetch vs useFetch
From the docs:
So theuseFetch,useLazyFetch,useAsyncDataanduseLazyAsyncDataonly work during setup or Lifecycle Hooks https://nuxt.com/docs/getting-started/data-fetching#usefetch
use... composables only work inside your vue templates. So whenever you have an issue on this, try to use $fetch , and if it's not available
import { $fetch } from 'ofetch'
(this module is built into nuxt)
public vs assets directory
Docs: https://nuxt.com/docs/getting-started/assets
You mainly want to use the public directory for your static files like fonts, images, videos, etc. They are being served at your project root and will not be modified by vite/webpack.
https://nuxt.com/docs/guide/directory-structure/public
The assets is only for files that will be processed by vite/webpack, and therefore also mostly need vite file handlers installed. This could be css files, svgs with nuxt-svgo or other files that are being processed on build.
https://nuxt.com/docs/getting-started/assets#assets-directory
Example:
- you have a few woff2 font files, that can be served as-is. You would put them into public
- you have some css files you want to include. You would put them into assets and include them with the nuxt.config css option.
- you have some 5mb 4000x3000 jpegs: you can either use nuxt/image (where they can stay in public because they are being minified at runtime, not a build time), or you can use a custom vite plugin which would require them to be in assets .10 replies
Vercel Analytics with Nuxt 3
Has anyone successfully tried to activate Vercel Analitics on a deployed Nuxt 3 project? Everytime I do, the build fails. It adds the
@nuxtjs/web-vitals package automatically and then does this:
So I installed this module manually but having the exact same issue.4 replies
Add custom files to watch for restarting nuxt (just like `nuxt.config.ts`)
Hi, in my
nuxt.config.ts, I am importing some typescript files. When changing the nuxt.config.ts file, or e.g. the .env file of a project, nuxt gets restarted. I want to archive the same, so that when I edit one of the files imported, nuxt should also restart:
so in this case if either generateSitemap.ts or cookieConfig is edited, I want to restart the whole nuxt server.6 replies
@vue/server-renderer or vue/server-renderer not found on build
I want to use the
@vue/server-renderer package to render a vue template on a server endpoint and send the rendered html code via an email.
Normally, this is already included in vue, so just
works on dev, but not on build. It tells me Cannot find module '/Users/fabian/Desktop/code/nuxt-wordpress-starter/.output/server/node_modules/vue/server-renderer/index.js'
I tried manually installing the package, so npm i @vue/server-renderer , and importing it like this:
but same behaviour, works on dev, not on build.
Does somebody know how this could be possible? It seems that nuxt is somehow removing this package in build, even though I am importing it.3 replies
Render a vue template completely on a server route (and get the string from it)
Hi there. I am using a backend api route to send an email. I have some JS data that I want to render as a HTML template string, which I can send as the email body.
I was thinking to use vue as a templating engine, since the whole nuxt ecosystem is vue.
So I tried:
But this gives me a error:
Do you have any idea on how to archive this?
6 replies
Nuxt/kit: when creating a module, how can I inject a script into the body
Hi there. I am currently creating a nuxt module. One of the things I need to do is, I have a minified .js file I want to inject into the body. But only on client side. I tried
This does include the script directly, so also in SSR. When adding something like
if (typeof window !== 'undefined') to only inject it on the client-side, it never gets injected since the src/module.ts seems to only run once on start.
I am sure that addTemplate is not the right method.
Do you know any method to add a file into the public folder?21 replies
