Nuxt 3 Support

[lazercaveman]

Hello, is it planned to add support for Nuxt 3 and composition api in near future?

[ymmooot]

Hi @lazercaveman.
I have a plan to make a new version for Nuxt3 and composition api within the next few months.
Please wait for it 🙏

[niklasfjeldberg]

Any @lazercaveman update on this?

[ymmooot]

Sorry for the delay.
I am working on this at https://github.com/ymmooot/nuxt-jsonld/tree/nuxt3 and it will be finished soon.
Please wait for the release.

[ymmooot]

I have just released the new version of nuxt-jsonld for Nuxt3 and it has composition api.
Please try the new version and give me feedback.
Thank you for waiting.

[Right-Brain-Group]

Link to repo not working.

[Raklon181995]

@ymmooot this link is not working

[ymmooot]

Why do you need the link?
It has been already released.

[torressam333]

Is this currently working? Do I need to install the new nuxt-jsonld package?
Thanks

[ymmooot]

Hi @torressam333.
nuxt-jsonld 2.x is for nuxt3.
nuxt-jsonld 1.x is for nuxt2.
They are both working.

[torressam333]

@ymmooot I currently have 2.0.8 installed in nuxt 3.

Can you confirm that this is what the plugin should look like for jsonld?

import { NuxtJsonld } from "nuxt-jsonld";

export default defineNuxtPlugin(({ app }) => {
  console.log({ app });
  return {
    provide: NuxtJsonld
  };
});

Then register in plugins like in nuxt2?

 plugins: [
      "~/plugins/jsonld",
    ],

Thanks!

[ymmooot]

@torressam333 nuxt-jsonld v2 is a nuxt module.
You should not create the plugin file. Please read the README.md.

[torressam333]

@ymmooot ok I registered as a module like the docs show but when I try to register a json option in the script[] option in nuxt.config.ts I get a TS error:

Type '{ type: "application/ld+json"; json: { "@context": string; "@type": string; name: string; legalName: string; url: string; logo: string; foundingDate: string; founders: { "@type": string; name: string; }[]; address: { ...; }; contactPoint: { ...; }; sameAs: string[]; }; }' is not assignable to type 'string | { [x: `data-${string}`]: Stringable | undefined; async?: Booleanable | undefined; crossorigin?: "" | "anonymous" | "use-credentials" | undefined; defer?: Booleanable | undefined; ... 23 more ...; tagDuplicateStrategy?: "replace" | ... 1 more ... | undefined; } | { ...; } | { ...; } | { ...; } | undefined'.
  Object literal may only specify known properties, and 'json' does not exist in type '{ [x: `data-${string}`]: Stringable | undefined; async?: Booleanable | undefined; crossorigin?: "" | "anonymous" | "use-credentials" | undefined; defer?: Booleanable | undefined; ... 23 more ...; tagDuplicateStrategy?: "replace" | ... 1 more ... | undefined; } | { ...; } | { ...; } | { ...; }'.ts(2322)

Do you have a concrete example of how to use json:{} inside of script[] ?

I am doing a port from a nuxt 2 app and this same script[json:{}] configuration works in nuxt 2.

[ymmooot]

I don't understand the meaning of json:{} inside of script[].
There is an example already.
https://github.com/ymmooot/nuxt-jsonld/tree/master/packages/example