Multiple Vue apps support

VueMeta includes basic support for using multiple Vue-apps which each adds their own metaInfo properties to the same html page.

To keep track of which tag has been added by which Vue app, VueMeta stores an unique appId in the data-vue-meta attribute.

WARNING

Currently VueMeta only supports adding tags for multiple apps.

Adding html, head or body attributes is not supported. These will always be set to the values of the last app which triggered a metaInfo update.

Therefore it is recommended you should only set those attributes from one of your Vue apps

Client

On the client side the appId starts at 1 and is incremented by one for each subsequent Vue app

SSR

For an SSR app which is served by a Node.js server, the appId would change for each request if we would increment it as on the client. Therefore we use the special ssrAppId so the appId is constant for every request.

On hydration VueMeta will check if the Vue app was server-rendered and if so set it's appId to ssrAppId as well.

vmid support

WARNING

Support for cross-app vmid's might be insufficient for real world applications.

It is possible to use cross app vmid's with two important caveats:

• The value of the last updated app is used
  Cross app vmid's only work on the client. This is implemented through the use of querySelectors, not by merging metaInfo objects. This means the last app which was refreshed determines the value that is used

• There is no fallback to use the vmid of a previous app
  Given app1 and app2 both with a metaInfo property with vmid1, then when app2 removes its value for vmid1 there is no way to retrieve app1's value for vmid1 which means the element is removed