vueuse / head

Document head management for Vue. Powered by Unhead. - 🌇 Sunset
https://unhead.unjs.io/setup/vue/installation
MIT License
906 stars 43 forks source link

Meta tags are "deduped" based on property name only #43

Closed yp0011 closed 1 year ago

yp0011 commented 2 years ago

According to https://ogp.me/ "If a tag can have multiple values, just put multiple versions of the same tag on your page."

In my use case I want to add multiple tags for the video pages of my website and I am adding these values to the meta array. The issue is that only 1 of the properties is added due to the fact that the property names are the same.

I have tested this by adding a suffix to each property name and all of the elements are added, although they are no longer valid OG tags.

<meta property="og:video:tag1" content="Bene Gesserit">
<meta property="og:video:tag2" content="Blade Runner 2049">
<meta property="og:video:tag3" content="Coming Soon">

Currently I only get

<meta property="og:video:tag" content="Coming Soon">

The desired outcoume would look like below :

<meta property="og:video:tag" content="Bene Gesserit">
<meta property="og:video:tag" content="Blade Runner 2049">
<meta property="og:video:tag" content="Coming Soon">

I would suggest that a check on the content property value is performed during the deduplication process in order to allow for the desired output as above.

egoist commented 2 years ago

You can use key attribute to avoid this.

glen-84 commented 2 years ago

You can use key attribute to avoid this.

Not sure how I missed this, although it does seem a little bit redundant if the content could be used for this purpose?

egoist commented 2 years ago

Not sure how I missed this, although it does seem a little bit redundant if the content could be used for this purpose?

yeah that seems like a good idea

husayt commented 2 years ago

After 0.7.3 I have the following lines from index.html dissappearing in the final build.

<meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="icon" href="/favicon.svg" type="image/svg+xml">

I guess this is related to this issue.

VeselyJan92 commented 2 years ago

As of @vueuse/head@v0.7.12, should I make reproduction repo?

harlan-zw commented 2 years ago

@VeselyJan92

What issue are you having exactly? Reproduction repo would be helpful

VeselyJan92 commented 2 years ago

Thanks for quick attention, but after giving it few hours I found out that there was a bug in i18n-module

https://github.com/nuxt-community/i18n-module/issues/1520

harlan-zw commented 1 year ago

Going to close this as the above is unrelated and the main issue is resolved.