How to get type of script from useHead()?

[nestle49]

How to get type of script from useHead()?

[Harlan Wilton]

Hi @nestle49

Would you further explaining what you mean, maybe with a code example as well?

[nestle49]

Before with vue-meta used MetaInfo['script'], now i used Script, but I'm force need 'as' syntax

// eslint-disable-next-line import/no-extraneous-dependencies
import { Script } from '@unhead/schema';

const scripts: Script[] = [];

scripts.push({
                innerHTML: [
                    `bodyScript`
                ]
                    .filter(notEmpty)
                    .join('\n')
            } as Script);

useHead({
    script: [...scripts],
    link: []
});

I need equivalent MetaInfo['script']

[Harlan Wilton]

Try something like this

import type { ReactiveHead } from '@vueuse/head'

const script: ReactiveHead['script'] = [];

script.push({
  src: 'https://unpkg.com/@unhead/vue@latest/dist/vue.esm-browser.js',
  defer: true
})

useHead({
  script,
})

[nestle49]

Thanks, but inside ReactiveHead['script'] doesn't exist 'callback' property

scripts.push({
    src: '',
    async: true,
    callback: () => {},
    json: {}
});

[Harlan Wilton]

That's because callback isn't a valid field, neither is json. You should refer to the docs, specifically the DOM events if you need some behaviour similar to callback

https://unhead.harlanzw.com/guide/guides/dom-event-handling