window is not defined

[devshittu]

Just trying out this plugin on my nuxtjs app I got "Reference Error! window is not defined" in "node_modules/vue-paystack/dist/paystack.min.js", please anyone with a workaround this?

[ifennna]

The plugin is probably being rendered server side.

Try adding it like this: { src: "~/plugins/vue-paystack", ssr: false },

[Devdre1909]

@devshittu

Were you able to get it to work?
I am using NuxtJS and I am having the same issues.

[AbbyJoe]

create a vue-paystack file in your plugins folder directory then import paystack like this:
import Vue from 'vue'
import paystack from 'vue-paystack'
Vue.use(paystack)

in your nuxt.config.js
set this { src: "~/plugins/vue-paystack", ssr: false } in your plugins array
then import paystack as component like this:
import paystack from 'vue-paystack/src'

[marvelefe]

Tried the above solution and still not working. Somehow it still gets rendered server side.
My error logs:

2021-09-17T15:10:48.630182Z ERROR window is not defined

2021-09-17T15:10:48.630214Z

2021-09-17T15:10:48.630224Z at Object.<anonymous> (node_modules/vue-paystack/dist/paystack.min.js:1:280)

2021-09-17T15:10:48.630233Z at Module.o._compile (node_modules/jiti/dist/v8cache.js:2:2778)
 
2021-09-17T15:10:48.630244Z at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
 
2021-09-17T15:10:48.630264Z at Module.load (internal/modules/cjs/loader.js:937:32)
 
2021-09-17T15:10:48.630274Z at Function.Module._load (internal/modules/cjs/loader.js:778:12)
 
2021-09-17T15:10:48.630282Z at Module.require (internal/modules/cjs/loader.js:961:19)
 
2021-09-17T15:10:48.630290Z at n (node_modules/jiti/dist/v8cache.js:2:2472)
 
2021-09-17T15:10:48.630301Z at node_modules/vue-server-renderer/build.prod.js:1:77944
 
2021-09-17T15:10:48.630310Z at Object.<anonymous> (webpack:/external "vue-paystack":1:0)
 
2021-09-17T15:10:48.630318Z at __webpack_require__ (webpack/bootstrap:25:0)

[Devdre1909]

@marvelefe can you share your Nuxt Config?

[iamraphson]

@marvelefe for next.js if this lib does not work, you can use this https://www.npmjs.com/package/nuxt-paystack

[marvelefe]

@Devdre1909 My plugins array in Nuxt Config:

......other plugins above
    {src: '~/plugins/mixitup.js', mode: 'client' },
    {src: '~/plugins/vue-paystack.js', mode: 'client' },
    {src: '~/plugins/moment.js', mode: 'client' }  
  ],

[marvelefe]

I'm using Nuxt @iamraphson

[iamraphson]

@marvelefe try that package. Any issue, let me know. Thanks

[marvelefe]

Aii. Package looks good. Thanks @iamraphson

[yvMuhammed]

pls help out on step by step on how to use this paystack on nuxt app

[devshittu]

@devshittu

Were you able to get it to work? I am using NuxtJS and I am having the same issues.

Yes I did boss

[devshittu]

I was able to get it to work in my app. If you need further help can you reproduce a repo to show what you are getting then we can collaborate and resolve this together.

[yvMuhammed]

have fix it with the nuxt package. thank you

…

On Tue, Mar 1, 2022, 12:40 PM Muhammed Shittu ***@***.***> wrote: I was able to get it to work in my app. If you need further help can you reproduce a repo to show what you are getting then we can collaborate and resolve this together. — Reply to this email directly, view it on GitHub <#26 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AW57343T5ATYUZWMRSSHABLU5X64NANCNFSM4UOFIOMA> . Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub>. You are receiving this because you commented.Message ID: ***@***.***>