mirror of
https://github.com/tenrok/vue-meta.git
synced 2026-06-22 15:30:33 +03:00
feat(ts): update types for v2 (#338)
* chore: update types for v2 * fix: script.type shouldnt be required fix: define meta.http-equiv as string, too many options to list * chore: improve types * chore: update typescript dependency * chore: remove unnecessary gitignore * chore: add metainfocomputed type * chore: use camelcase for type * chore: add interfaces for metaInfo properties * chore: add missing body boolen for script types * chore: include all type files on build * chore: remove unused import
This commit is contained in:
@@ -0,0 +1,72 @@
|
||||
import Vue, { ComponentOptions } from 'vue'
|
||||
import VueMeta, { VueMetaPlugin, VueMetaOptions, MetaInfo, MetaInfoSSR } from '../index'
|
||||
|
||||
Vue.use(VueMeta, {
|
||||
keyName: 'head'
|
||||
} as VueMetaOptions)
|
||||
|
||||
const FooMetaInfo: MetaInfo = {
|
||||
title: 'title',
|
||||
titleTemplate: '%s - Home',
|
||||
bodyAttrs: { class: 'a' }
|
||||
}
|
||||
|
||||
const BarMetaInfo: MetaInfo = {
|
||||
title: 'title',
|
||||
titleTemplate: c => `${c} - Home`,
|
||||
bodyAttrs: { class: ['a', 'b'] },
|
||||
__dangerouslyDisableSanitizers: ['script'],
|
||||
__dangerouslyDisableSanitizersByTagID: {
|
||||
ldjson: ['innerHTML']
|
||||
},
|
||||
script: [{
|
||||
src: '', crossorigin: '', async: true
|
||||
}],
|
||||
meta: [
|
||||
{ charset: 'utf-8' },
|
||||
{
|
||||
'property': 'og:title',
|
||||
'content': 'Test title',
|
||||
'template': chunk => `${chunk} - My page`, //or as string template: '%s - My page',
|
||||
'vmid': 'og:title'
|
||||
}
|
||||
],
|
||||
changed(newdata: MetaInfo, newTags: HTMLElement[], oldTags: HTMLElement[]) {
|
||||
},
|
||||
afterNavigation(data: MetaInfo) {
|
||||
}
|
||||
}
|
||||
|
||||
const Foo: ComponentOptions<Vue> = {
|
||||
metaInfo: FooMetaInfo
|
||||
}
|
||||
|
||||
const Bar: ComponentOptions<Vue> = {
|
||||
metaInfo() {
|
||||
return BarMetaInfo
|
||||
}
|
||||
}
|
||||
|
||||
const app: Vue = new Vue(Foo)
|
||||
const $meta: VueMetaPlugin = app.$meta()
|
||||
|
||||
// getOptions
|
||||
const options: VueMetaOptions = $meta.getOptions()
|
||||
|
||||
// client side refresh
|
||||
const { metaInfo: metaData1 }: { metaInfo: MetaInfo } = $meta.refresh()
|
||||
|
||||
// server side injection
|
||||
const metaDataSSR: MetaInfoSSR = $meta.inject()
|
||||
if (metaDataSSR.script) {
|
||||
metaDataSSR.script.text()
|
||||
metaDataSSR.script.text({ body: true })
|
||||
}
|
||||
|
||||
// pausing & resuming
|
||||
let resume
|
||||
resume = $meta.pause()
|
||||
const ret: void = resume()
|
||||
resume = $meta.pause(true)
|
||||
const { metaInfo: metaData2 }: { metaInfo: MetaInfo } = resume()
|
||||
const { metaInfo: metaData3 }: { metaInfo: MetaInfo } = $meta.resume(true)
|
||||
@@ -0,0 +1,18 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "es5",
|
||||
"module": "es2015",
|
||||
"moduleResolution": "node",
|
||||
"strict": true,
|
||||
"noEmit": true,
|
||||
"lib": [
|
||||
"es5",
|
||||
"dom",
|
||||
"es2015.promise"
|
||||
]
|
||||
},
|
||||
"include": [
|
||||
"*.ts",
|
||||
"../*.d.ts"
|
||||
]
|
||||
}
|
||||
Reference in New Issue
Block a user