feat: add meta information to head

This commit is contained in:
Sebin Nyshkim 2020-03-06 21:20:32 +01:00
parent dc9192d58d
commit fa6dd99816
6 changed files with 77 additions and 5 deletions

15
package-lock.json generated
View file

@ -11514,6 +11514,21 @@
"vue-style-loader": "^4.1.0" "vue-style-loader": "^4.1.0"
} }
}, },
"vue-meta": {
"version": "2.3.3",
"resolved": "https://registry.npmjs.org/vue-meta/-/vue-meta-2.3.3.tgz",
"integrity": "sha512-FmeekLkd5+BI7NFBnU4bEnTpVZqmu3q8ztW4R4U3GBQljgDM7QAuwMXs8/aJP0U1tjtxobX8T6HcyZXimGj1DQ==",
"requires": {
"deepmerge": "^4.2.2"
},
"dependencies": {
"deepmerge": {
"version": "4.2.2",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
"integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg=="
}
}
},
"vue-style-loader": { "vue-style-loader": {
"version": "4.1.2", "version": "4.1.2",
"resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz", "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz",

View file

@ -9,7 +9,8 @@
}, },
"dependencies": { "dependencies": {
"core-js": "^3.3.2", "core-js": "^3.3.2",
"vue": "^2.6.10" "vue": "^2.6.10",
"vue-meta": "^2.3.3"
}, },
"devDependencies": { "devDependencies": {
"@vue/cli-plugin-babel": "^4.0.0", "@vue/cli-plugin-babel": "^4.0.0",

Binary file not shown.

After

Width:  |  Height:  |  Size: 752 KiB

View file

@ -4,8 +4,6 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>sebin-reference</title>
</head> </head>
<body> <body>
<noscript> <noscript>

View file

@ -307,7 +307,62 @@ export default {
clothes: this.getClothesPics() clothes: this.getClothesPics()
}; };
}, },
mixins: [Sebin, Helper] mixins: [Sebin, Helper],
metaInfo: {
title: "Sebin Nyshkim - Reference Page",
link: [
{ rel: "favicon", href: "/img/sebin-smug-icon.png" },
{ rel: "icon", href: "/img/sebin-smug-icon.png" }
],
meta: [
{ charset: "utf-8" },
{
name: "twitter:card",
content: "summary"
},
{
name: "twitter:creator",
content: "@SebinNyshkim"
},
{
name: "twitter:description",
content:
"Learn everything about your favorite neighborhood derg, down the the minute details!"
},
{
name: "twitter:title",
content: "Sebin Nyshkim - Reference Page"
},
{
name: "twitter:image",
content: "http://ref.sebin-nyshkim.net/img/sebin-smug-icon.png"
},
{
property: "og:title",
content: "Sebin Nyshkim - Reference Page"
},
{
property: "og:type",
content: "website"
},
{
property: "og:url",
content: "http://ref.sebin-nyshkim.net"
},
{
property: "og:image",
content: "http://ref.sebin-nyshkim.net/img/sebin-smug-icon.png"
},
{
property: "og:description",
content:
"Learn everything about your favorite neighborhood derg, down the the minute details!"
}
],
htmlAttrs: {
lang: "en"
}
}
}; };
</script> </script>
@ -332,7 +387,7 @@ export default {
font-size: 1.25em; font-size: 1.25em;
} }
@media (min-width: 60em) { @media (min-width: 160em) {
font-size: 1.5em; font-size: 1.5em;
} }
} }

View file

@ -1,8 +1,11 @@
import Vue from "vue"; import Vue from "vue";
import Meta from "vue-meta";
import App from "./App.vue"; import App from "./App.vue";
Vue.config.productionTip = false; Vue.config.productionTip = false;
Vue.use(Meta);
new Vue({ new Vue({
render: h => h(App) render: h => h(App)
}).$mount("#app"); }).$mount("#app");