Trying to add Node modules (Vuetify/ElementUI/Vuesax) to Frappe

Integration
1

Trying to add Node modules, one of (Vuetify/ElementUI/Vuesax) to Frappe
but getting ReferenceError: process is not defined

Tried solution from this thread (How to add a node module to a custom app?) still nothing.

Note: few modules are working perfectly, eg. @morioh/v-perfect-scrollbar

Frappe: 12.18
Vue: 2.6.8

@revant_one, @netchampfaris, @umair any ideas ?

2

I would recommend browsing the POS-Awesome repository. I basically just followed what he did, and that’s how I learned to include external libraries.

3

Thanks for you response @dj12djdjs,

I think I already tried that,

Just after Importing,

1st approach,
import Vuesax from ‘vuesax’;
Vue.use(Vuesax );

or
2nd approach from in GitHub - yrestom/POS-Awesome: POS Awesome is an open-source Point of Sale for Erpnext using Vue.js and Vuetify
vuetify: new Vuetify(),

Err in Console
ReferenceError: process is not defined from (vue.runtime.esm.js:383:18)

4

Which Vuetify file are you loading into your app. It should be this one:

5

yup, I added that too in hooks.py

“/assets/frappe/node_modules/vuetify/dist/vuetify.js”,

Still process is not defined.

6

Is there any other files you’re including? Maybe Vuex, or other library?

7

No, I tried with different libraries each at a time,

Tried Vuetify, Then Vuesax, then Element.

8

Can you share your hooks.py app_include_js and your build.json and your vue apps entry point source ?

9

I will try once more, and let you know.

11

@dj12djdjs

I reinstalled everything, now the import issue is gone,

Stuck at this point,

Unknown custom element: < - v-btn - > - did you register the component correctly? For recursive components, make sure to provide the “name” option.