Plugin Creation In Faveo

How is it designed ?
There are some empty divs that defined in some components which can be used for injecting vue components from outside. So whenever that div is mounted, it dispatches an event which can/cannot have some external data. Now, that event can be listened to perform any action at that specific time.

There will be some predefined div ids in Faveo and only those Ids can be used to override or inject vue components.

Problem 1 : We are using document.setAttribute to pass data in the above event and attributes can only be set as a string, so if an event is passing data as object, it will be string filed and passed to the component. So in the component it has to be parsed before it can be used.

One way to implement this could be to define a prop in your component as `data` and now create a computed property which returns parsed version of the data.

See the example below :

Now, in layouts some events will be dispatched, you can create a service provider which will be listening to this event and in response it which echo out the script whose source will be the path to your bundle (you can host it on a cdn or separately upload it from plugins page).

See the below example :

Now, create a yourPluginName.js file and call injectComponentIntoView function to be able to inject your script into the view.

See the below example :