¿Alguien ya usó el paquete AOS o vue-aos con Vue3?
Recibo un montón de errores debido probablemente a ssr (Vue no está definido, el documento no está definido) a pesar de deshabilitarlo en la configuración.
nuxt.config.ts
export default defineNuxtConfig({ plugins: [ { src: '~/plugins/aos', mode: 'client', ssr: false } ], }}plugins/aos.ts
import VueAOS from "vue-aos" export default defineNuxtPlugin(nuxtApp => { nuxtApp.vueApp.use(VueAOS) })Probé de esta manera, probé con archivos cdn (pero conduce a que AOS no esté definido cuando se usa .init() y ambos no funcionan. Todos los tutoriales sobre AOS están relacionados con Nuxt2.
También traté de poner el paquete vue-aos en build.transpile en la configuración de nuxt sin éxito.
Muchas gracias
nuxt.config.ts
import { defineNuxtConfig } from 'nuxt3' export default defineNuxtConfig({ vue: { compilerOptions: { isCustomElement: tag => ['aos-vue'].includes(tag) } } })También sufrí con este problema de que AOS no funcionaba en Nuxt3.
Para mí, la solución fue configurar el complemento en NuxtConfig en modo cliente como se muestra a continuación:
plugins: [{ src: "@/plugins/aos", ssr: false, mode: "client" }],Después de eso, aparece un documento de problema que no está definido. Esto se debió a que cuando la ventana no está definida, no se puede encontrar el documento.
Lo arreglé con el siguiente código en el archivo aos.ts en la carpeta de complementos:
import AOS from "aos" import "aos/dist/aos.css" export default defineNuxtPlugin((nuxtApp) => { if (typeof window !== "undefined") { nuxtApp.AOS = AOS.init() // eslint-disable-line new-cap } })¡Espero que esto funcione para ti también!