PrimeVue Nuxt Module

PrimeVue provides an official module for Nuxt.
www.npmjs.com/...

[@ancestralsystems4929]

Really simplified the setup. Nice. Prime vue is always my #1 component library, love flex too. Great work!

[@DmitryLubenskiy]

Everything looks great! But nothing works: Failed to resolve import "primevue/resources/themes/aura-light-green/theme.css". Whatever you try (update, remove, start from scratch, pray, cry, die) -- there is no "resource" folder in this package.

[@fullstacklarry]

As simple as 123, updated and had some padding issues and mismatch themes went to docs and to my suprise I see a nuxt module. needed this OG Primetime 😎

[@cagataycivici]

If is possibly due to CSS layer, please see;
primevue.org/guides/csslayer/
You can use cssLayerOrder to fix this.

[@fullstacklarry]

Yes, this was the issue, I see that this was a recently discussed topic. I have solved the issue. Thank you. It's primetime...

[@rasensio]

@@cagataycivici page not found

[@dicodidiraja]

Great video, documentation needs an upgrade

[@lucasferrero123]

nice to start prototyping right away

[@mohammadrayat7917]

Hello!
I wanted to change the calendar type from Gregorian to Solar (Jalali). How can I do this?

[@zooldeveloper]

Hi, I'm using primevue as the first time in a nuxt project that I don't want to implement the dark mode feature. I already read the documentation but I couldn't find a way to disable it completely. So is there a way to disable dark mode easily?

[@PixelVoyager-x2i]

How do you register ToastService it does not work adding Toast and ToastService. Where do I put the ToastService?

[@jahiddev]

🎉

[@ranulagihara1113]

hey bro, I have following your tutorials for a long time, here I am encountering a some sort of troubles in primevue Dropdowns, I wanted to disable the multiple file selection option in a :mode="'advanced'", (since I am using for CSV uploader ).
It will not working even though I :multiple="false", how can I probably stop the multiple file selecting option ? can you pls help me ?

[@marcosjesus07]

not working actually.
[nitro 18:17:18] ERROR RollupError: node_modules/@primevue/nuxt-module/dist/runtime/plugin.server.mjs (1:30): "themes" is not exported by "virtual:#primevue-style", imported by "node_modules/@primevue/nuxt-module/dist/runtime/plugin.server.mjs".

[@JoaoXStone]

Currently it doesn't work, I consulted the nuxt and primevue documentation but it didn't work on my Windows

[@princeherman8730]

Same here

[@ragura]

Thank you for this release and the continued work on Primevue! Is there a chance the Nuxt module could be extended with premade templates such as Sakai Vue? Your previous video on the template handles moving files into a Vite/Vue project, but with Nuxt's page/layout system much of it works differently. I understand you have a lot on your plate, so if it's not on the roadmap then consider it a feature request for the future!

[@cagataycivici]

Thanks, do you mean Sakai Nuxt? There is one already -> github.com/primefaces/sakai-nuxt

[@ragura]

@@cagataycivici I completely missed that it existed! That’s what I was looking for, yes 👍

[@adolfusadams4615]

Instead of using css: ['primevue/resources/themes/lara-light-teal/theme.css'], what would the configuration be to use TailwindCSS?

[@cagataycivici]

Please see -> github.com/primefaces/primevue-examples/tree/main/nuxt-unstyled-tailwind

[@adolfusadams4615]

@@cagataycivici Do you have documentation on how to style all the components with Tailwind when the unstyled optioned is used?

[@adolfusadams4615]

I was referring to the "pass-through" and after my previous post I saw that each of the components has pass-through documentation, so my question has been answered.

[@ffuyu]

I always wanted a Nuxt module. Really appreciate it but I have a concern about imports. One of the reasons I wanted a nuxt module was auto importing all components and tree shaking on build, it seems we still have to import each component in config, can we leave it blank to import all components?

[@cagataycivici]

Ignoring import config auto imports, or import: '*'.

[@broodlum]

@@cagataycivici Does leaving it at the default incur any performance/bundle-size penalty?

[@cagataycivici]

@@broodlumRight now it will try to create a chunk for components that you do not use as well so currently using include is suggested. In upcoming versions of the module, we'll dive into tree shaking, if that works, there won't be a need to worry about components config as everything will be auto-imported and gets tree shaken.

[@bowaller6892]

Can you create a video with nuxt, primevue and tailwind setup?

[@cagataycivici]

Yes, I'm working on it. Here is the example repo in the meantime that you can use as a starter -> github.com/primefaces/primevue-examples/tree/main/nuxt-unstyled-tailwind

[@BertilJohannesIpsen]

Does it work with Tailwind? I can't seem to get it to work with pt: Tailwind in the options.

[@cagataycivici]

Can you share your code at GitHub Discussions please and post the link here.

[@broodlum]

@@cagataycivici Discussions are currently not enabled on the primevue-nuxt-module repo.

[@cagataycivici]

@@broodlumWe use a central one -> github.com/primefaces

[@litergame]

How the hell does one implement a theme switch with this? I'm getting headaches from it.

[@dagidam6809]

Yeah, any one implemented a dynamic theme switch?

[@ranulagihara1113]

hey there, a big fan of you, I have been using primevue and following your videos for a long time, recently I am encountering a some sort of troubles in primevue Dropdowns, I wanted to disable the multiple file selection option in a :mode="'advanced'", (since I am using for CSV uploader ).
It will not working even though I :multiple="false", how can I probably stop the multiple file selecting option ?

[@ranulagihara1113]

Drag and drop a file to here to upload.



how I use it,

[@mknmkn2222]

[@jorgevaldesnarvaez5504]

Great tutorial but doesn't work hahaha it is harder to replicate the same styles

[@EmirCivici]

Siüüüü

[@NurcanCivici-g7f]

😤