The Be Sure Blog

Code Snippets | Problem Solving | Tips & Tricks

The Be Sure Blog banner

How to add HTML head data to a Nuxt 3 app

posted on 4.2.2023 by Below Surface in "Nuxt"

Within nuxt.config.ts, add something like that and extend it to your needs:

app: {    
    head: {      
        charset: 'utf-8',      
        viewport: 'width=device-width,initial-scale=1.0',      
        title: 'Amazing Website',   
        link: [ { rel: 'icon', href: './images/icons/favicon.png' } ],
        meta: [        
            // <meta name="description" content="My amazing site">        
            { name: 'description', content: 'My amazing site.' }      
        ],    
    }  
},

Tags:

nuxt
seo
head

Sources:

https://www.reddit.com/r/Nuxt/comments/wcoff4/nuxt_3_favicon_from_public_folder_not_included_in/

More posts of this category

My Nuxt 3 fix for npm ERR! Invalid comparator: latest

After starting to code with Nuxt, I ran into this issue and found the fix

Nuxt

Use environmental variables in Nuxt 3

Learn about .env, runtimeConfig and the setup() method

Nuxt

Pm2: Make your Nuxt 3 live app run on a port other than 3000

A five hour research solution for switching the live port to 3002

Nuxt