Modified creation of Vue root app in app.js
-
Hello everyone,
I try to find way how could reach to be able modified/wrap creation of Vue root app in app.js. The code which is generated by Quasar automatically is look like this
const app = { el: '#q-app', router, store, render: h => h(App) }
My case what I tried to do is wrap this kind code in my solution which look like this
Office.onReady(function () { var app = new Vue({ el: "#q-app", render: h => h(App, {}), router, i18n: i18n, store: store // comments: { root } }) })
I read the docs that if developer want modified or init something before the app starts then the boot files should be used, but I am not sure if this solution can be reached by the boot file.
I would appreciate any suggestions.
Thank you so much in advance. -
What is Office?
Scott
-
Office is javascript API for any Office 365 products. More info can be found here https://docs.microsoft.com/en-us/office/dev/add-ins/develop/understanding-the-javascript-api-for-office#initialize-with-officeonready and function OnReady means when the API is successfully loaded by any Office 365 clients then this function is called.
And on this event I would like tell quasar do create Vue root app and render it. If my explanation is not enough do not hesitate to ask me more questions and I would try to explain in more details.Thanks you
Jan Vaca -
You might be better off (easier to work into the add-in) using Quasar as a Vue plug-in. It’s the components you want and that’s the easiest way to get them.
https://quasar.dev/start/vue-cli-plugin
Scott
-
This might not work with Office specifically, but a boot file can wait asynchronously:
export default async ({ Vue }) => { await Office.onReady(function () { // ... }); };
Notice the
async
andawait
. Add that boot file first thing in theboot
array inquasar.conf.js
.I’ve used this pattern to wait fetching a configuration file before my app initializes Vue.