Vue Meta

Manage HTML metadata in Vue.js components with SSR support
Alternatives To Vue Meta
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
Vuepress21,247304299a month ago151August 28, 2022570mitJavaScript
📝 Minimalistic Vue-powered static site generator
Prerender Spa Plugin7,2544262163 months ago19September 01, 2018204mitJavaScript
Prerenders static HTML in a single-page application.
React Snap4,882129352 days ago86December 13, 2018187mitJavaScript
👻 Zero-configuration framework-agnostic static prerendering for SPAs
Vue Meta3,9974,6113089 days ago72February 17, 202251otherJavaScript
Manage HTML metadata in Vue.js components with SSR support
a month ago31May 27, 20222mitJavaScript
Integrated online shop based on Laravel 9 and the Aimeos e-commerce framework for ultra-fast online shops, scalable marketplaces, complex B2B applications and #gigacommerce
18 days ago4November 03, 2021109apache-2.0Go
13 days ago13mitVue
Vuesion is a boilerplate that helps product teams build faster than ever with fewer headaches and modern best practices across engineering & design.
Lin Cms Vue2,590
2 months ago67mitJavaScript
🔆 Vue+ElementPlus构建的CMS开发框架
a month ago1January 04, 201928apache-2.0Go
dynamic server-side rendering using headless Chrome to effortlessly solve the SEO problem for modern javascript websites
Vite Ssg9365a month ago83June 30, 202273mitTypeScript
Static site generation for Vue 3 on Vite
Alternatives To Vue Meta
Select To Compare

Alternative Project Comparisons

✌️🥉 Check the next branch for Vue3 support


Manage HTML metadata in Vue.js components with SSR support

npm downloads npm version Coverage Status Build Status dependencies Status Discord


  export default {
    metaInfo: {
      title: 'My Example App',
      titleTemplate: '%s - Yay!',
      htmlAttrs: {
        lang: 'en',
        amp: true
<html lang="en" amp>
  <title>My Example App - Yay!</title>


Vue Meta is a Vue.js plugin that allows you to manage your app's metadata. It is inspired by and works similar as react-helmet for react. However, instead of setting your data as props passed to a proprietary component, you simply export it as part of your component's data using the metaInfo property.

These properties, when set on a deeply nested component, will cleverly overwrite their parent components' metaInfo, thereby enabling custom info for each top-level view as well as coupling metadata directly to deeply nested subcomponents for more maintainable code.


Please find the documention on

🌐 Please help us translate the documentation into your language, see here for more information


Looking for more examples what vue-meta can do for you? Have a look at the examples


$ yarn add vue-meta
$ npm install vue-meta --save
Download / CDN

Use the download links below - if you want a previous version, check the instructions at

Latest version:

Latest v1.x version:[email protected]/dist/vue-meta.min.js


<script src=""></script>


<script src=""></script>

Quick Usage

See the documentation for more information

import Vue from 'vue'
import VueMeta from 'vue-meta'

Vue.use(VueMeta, {
  // optional pluginOptions
  refreshOnceOnNavigation: true

Frameworks using vue-meta

If you wish to create your app even more quickly, take a look at the following frameworks which use vue-meta

  • Nuxt.js - The Vue.js Progressive Framework
  • Gridsome - The Vue.js JAMstack Framework
  • Ream - Framework for building universal web app and static website in Vue.js
  • Vue-Storefront - PWA for eCommerce
  • Factor JS - Extension-first VueJS platform for front-end developers.

How to translate documentation

Thanks for your interest in translating the documentation. As our docs are based on VuePress, we recommend to have a look at their docs about internationalization as well

Here are the steps you will need to take:

  • Clone this repository
  • Create a new branch
  • Browse to /docs/
  • Create a folder with the language code you will add a translation for (eg /zh/)
  • Copy all *.md files and the folders api, faq, and guide to that folder
  • Translate the copied files in your language folder
  • Edit .vuepress/config.yml and add a config section for your locale in both locales as themeConfig.locales
  • Test your translation by running the docs dev server with yarn docs
  • Create a pull request with your changes
  • Receive eternal gratefulness from your fellow language speakers ❤️

Old versions

Click here if you are looking for the old v1 readme



Popular Vue Projects
Popular Seo Projects
Popular Web User Interface Categories
Related Searches

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.