Login

u/HumanOnlyWeb

r/vuejs r/vscode r/Nuxt r/paperdesign
Nuxt v4.6.0
▲ 25 r/Nuxt

Nuxt v4.6.0

The release note has some bangers! 🔥

I can already anticipate the new nuxt/server being a great topic of discussion 👀

github.com
u/HumanOnlyWeb — 10 days ago
▲ 3 r/vuejs+1 crossposts

I built a VS code extension with Vue

TLDR;

  • I built a SQLite explorer VS code with Vue/Vite. Code lives in sqlite-explorer
  • For now, you can only build locally, for you OS and install. I have not been able to publish to the VScode marketplace: the UX sucks and I have reached out to support

I read the "Your First Extension" guide on GH for building extensions and for the life of me, couldn't understand why they still use Yeoman 😅.
Tried using it as-is but found myself raw dogging plain JS, with `getElementById` everywhere.

So I scaffolded a new vue project, built the different views, then went back to reading GH docs on extension. (Vue related code in webview)

Turns out (one of)the key files for an extension is the `src/extension.ts` file.
The rest is history.

Took me a bit longer than I'd anticipated and (disclaimer), I used Claude to help debug some issues I was having with `better-sqlite3` and packaging for different OS.

(I've tested only on MacOS and it *works well 😅. I'll appreciate testers on different OS)

Before someone asked,

  • I know there's SQLite Viewer but you need a Pro account to edit/modify data
  • Using Tableplus means I have to keep going back and forth between it and vscode.
  • I finally learned how to build a vscode extension with the tools I already know and use: Vue

I have a tremendous respect for some of the people creating very complex vscode extensions; building thing that supports multi OS is a pain in the behind.

Anyway, I'll post an update here if I ever succeed to publish it in the extension marketplace.
The code is not perfect and I'll appreciate CONSTRUCTIVE feedback, if you're so inclined.

Happy Vueing

u/HumanOnlyWeb — 3 months ago
▲ 30 r/Nuxt

Hydration mIsMaTcH 🫪

I'm currently building a Canada based EV platform with fancy words like "Prairie" and "Québec" (remember the "é") and for the life of me, couldn't figure out why my browser kept screaming about "hydration mismatch"

It turns out Chrome saw "Québec" and said "fck yea, let's translate"

It not only translated it to replace the "é" with a regular "e" but also translated "prairie" to "meadow" 😅

My French is passable, but I was so frustrated, and had pulled my last hair out to even guess that's what was causing the issue, even after I started seeing random "meadows" on the pages.

The client has plans to have it in both languages (🇬🇧/🇫🇷), but for now the quickest fix was a: 

// nuxt.config.ts
app: {
  head: {
    meta: [{ name: "google", content: "notranslate" }]
  }
}

Boring post, but I hope it helps someone, especially if you're working with content in different languages

reddit.com
u/HumanOnlyWeb — 3 months ago
▲ 12 r/Nuxt

I have a question about the current NuxtLab x Vercel collaboration:

I noticed some packages built by the Nuxt team now fall under Vercel OSS (case study: Comark. I didn't mention Nuxt itself since Daniel had mentioned Nuxt will always remain opensource, community project).

If NuxtLab were to leave Vercel or something similar, what would happen to all the stuff built by the Nuxt team under Vercel OSS?

Would Vercel own those projects?

reddit.com
u/HumanOnlyWeb — 6 months ago