-2

I need to use UI Components Vuetify with Angular, I use VueCustomElement with angular and work successfully but I tried to add Vuetify but I got some errors like missing $attr, $ ...etc.

I need to add Vuesax, Quaser, or Vuetify because I love it. I know all types of materials like Angular material or PrimeNg but need more customized and I don't have spare time for work.

app.module.ts:

@NgModule({
  schemas: [
    CUSTOM_ELEMENTS_SCHEMA
  ]
})

app.component.html:

<my-vue-web-comp></my-vue-web-comp>

app.js

import Vue from 'vue/dist/vue';
import vueCustomElement from 'vue-custom-element';
import Vuetify from 'vuetify';
import {VApp} from 'vuetify/lib';

Vue.use(Vuetify)
Vue.component('v-app', VApp)
Vue.use(vueCustomElement);
 const MyVueWebComp = {
    template:`
      <v-app></v-app>
    `
  };
  Vue.customElement('my-vue-web-comp', MyVueWebComp);
  • 1
    This is quite frankly a horrible idea, trying to use UI frameworks specifically designed for Vue to try to make it work with Angular and or React. Why not stick to one UI framework? – Jason Landbridge Nov 30 '20 at 23:19
  • because angular material needs more customization. – Faceless Void Dec 01 '20 at 10:45
  • Well there is nothing wrong when thinking out of the box! However, this is impossible. I love Vuetify and been working on it for around 3 years. Just now I went through https://material.angular.io/components/categories. This is as good as Vuetify. – Anoop Thiruonam Feb 04 '21 at 18:34

1 Answers1

0

I'm afraid you will just have to bite the bullet and either switch to Vue.js or use a framework designed for Angular. There are a lot of dependencies in Vuetify (and the others) that are written for Vue and would need to be rewritten to work in Angular. There is no simple fix.

If you really don't have the time, you could get a UI kit similar to this or this. They will usually cost at least a flat fee, but they have pre-styled UI elements similar to Vuetify.

Edit: You could also just use something like Bootstrap which has the elements pre-styled. Maybe that could be a middle ground.

codeartistgirl
  • 69
  • 2
  • 10
  • Thanks for your interest, I know Devexpress form builder, but I don't need it. If you see Vuetify functionality and the largest UI components I mean like this http://www.materionic.com or https://material-ui.com/ – Faceless Void Dec 04 '20 at 07:05