Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
Hello, I have a few questions and I hope somebody can help me.
I want to build an own tool in Nova and use an external library like Vuetify and maybe others. The step that I did was installing vuetify in my project and including it like this in my tool.js: https://d.pr/i/E9mU4C
Then I get node sass errors while compiling the resource. Some folks at vuetify told me that I should not use node-sass but another compiler and I should update Laravel Mix to version 4. I did that and the node-sass errors went away.
But in my console I do see this now: https://d.pr/i/3ZYjVJ and the page looks like this: https://d.pr/i/Va9Lzt
Then I changed the implementation like this (importing Vue as well and use Vuetify outside of Nova.booting: https://d.pr/i/oHvoyx The errors in the console went away, but the components are still not showing up and I have the same view as here: https://d.pr/i/Va9Lzt
So my question is, how I can include a library like Vuetify in Nova? And why am I seeing a blank screen of the tool.vue component when using Mix 4?
Thanks!
Hi @elbsurfer
I wonder why would you do that? Vuetify is just like Bootstrap - set of fixed modules / elements. With nova tool, you have access to underlying vuejs javascript and tailwindcss styling. You can more less build whatever you like. Give those tools a try instead of going for something that will be hard to customize.
Hope it helps!
Thanks for your reply @aurawindsurfing
I think it's out of convenience, because I habe used Vuetify in a lot of projects. I will take a look at Tailwind, but it would be interesting for other chart libraries if I know how I can include them in Nova.
@aurawindsurfing When I want to use a DatePicker Field in my custom tool - do you know how I can make use of this field in my tool?
https://nova.laravel.com/docs/2.0/resources/fields.html#date-field
As this is defined in PHP, I thought that I can use Nova Field Components in my tool.vue?
Hi @elbsurfer
You need to define it as a custom field and not as a custom tool:
https://nova.laravel.com/docs/2.0/customization/fields.html#fields
@elbsurfer do you found a solution regarding this matter, nova components can be reused for custom tools? Because we are thinking of using nova or using vuetify instead
@nchatziavraam We do not make use of Nova and created our own Backend-UIs with Vuetify.
Please or to participate in this conversation.