createScrollRevealDirective is not a function

facalz commented 2 years ago

Hello,

I don't know if I configured something wrong or if it's really having problems, I tried with the default settings and with the custom settings and both give an error.

error:

component:

<h1 v-scroll-reveal>
...
</h1>

scrollReveal.client.ts:

import { createScrollRevealDirective } from 'vue-scroll-reveal';

export default defineNuxtPlugin((nuxtApp) => {
    nuxtApp.vueApp.directive('scroll-reveal', createScrollRevealDirective({
        delay: 1000,
        duration: 150,
        reset: true,
    }));
});

nuxt.config.ts

export default defineNuxtConfig({
    ssr: false,
    modules: ["@nuxtjs/tailwindcss", "@nuxtjs/color-mode"],
    tailwindcss: {
        cssPath: "~/assets/css/tailwind.css",
        configPath: "tailwind.config.js",
        exposeConfig: false,
        injectPosition: 0,
        viewer: true,
    },
    colorMode: {
        classSuffix: "",
    },
    css: [
        '~/assets/css/global.scss'
    ]
});

facalz commented 2 years ago

Forgot to say but i'm using nuxt3

facalz commented 2 years ago

Was trying to solve it and saw that WolfgangDrescher commented in another issue to type npm link vue-scroll-reveal and then npm i https://github.com/tserkov/vue-scroll-reveal/tree/v2, typed this and it worked. Apparently yarn add vue-scroll-reveal@2 scrollreveal didn't work as it should.

tserkov / vue-scroll-reveal

createScrollRevealDirective is not a function #41