Kako dodati meta oznake v Nuxt.js

Nuxt.js je zmogljivo ogrodje za gradnjo aplikacij Vue.js, upodobljenih na strani strežnika. Nuxt.js poleg zagotavljanja trdne podlage za gradnjo kompleksnih aplikacij omogoča preprosto dodajanje metaoznak na vaše strani.

Ugotovite, kako vključiti metaoznake v svojo aplikacijo Nuxt, da izboljšate SEO in vidnost svojega spletnega mesta v družbenih medijih.

Meta oznake so delčki kode, ki zagotavljajo informacije o spletni strani. Te oznake so prisotne v viru HTML, tako kot vsebina vaše strani, vendar niso vidne na sami strani.

Meta oznake lahko zagotovijo informacije, kot so naslov strani, opis in ključne besede. Uporabljajo se tudi za zagotavljanje informacij za skupno rabo v družbenih medijih in optimizacijo iskalnikov.

Preden se lotite dodajanja metaoznak, ustvarite novo aplikacijo Nuxt.js. Za to se prepričajte, da imate Node.js nameščen v vaši napravi. Nato odprite terminal in zaženite naslednji ukaz:

npx create-nuxt-app moja aplikacija

To bo ustvarilo novo aplikacijo Nuxt.js v imeniku, imenovanem moja aplikacija. Sledite navodilom za konfiguracijo aplikacije po potrebi.

Eden od načinov za dodajanje metaoznak vaši aplikaciji Nuxt.js je, da jih dodate globalno. Če želite to narediti, dodajte naslovno oznako in dve metaoznaki: eno za nabor znakov in eno za vidno polje. Odpri svojo nuxt.config.js datoteko in dodajte lastnost glave modul.izvozi predmet:

modul.exports = {
 glava: {
 naslov: 'Moja aplikacija',
 meta: [
 { nabor znakov: 'utf-8' },
 { ime: 'viewport', vsebino: 'width=device-width, initial-scale=1' }
 ]
 }
}

Dodajanje metaoznak na posamezne strani

Včasih boste morda želeli dodati metaoznake samo določenim stranem v aplikaciji. Če želite to narediti, lahko definiciji komponente za stran dodate lastnost glave: