search

iamraphson / vue-paystack

Paystack Vue Plugin for Vue 2.X
https://www.npmjs.com/package/vue-paystack
MIT License
119 stars 45 forks source link

window is not defined #26

Open devshittu opened 3 years ago

devshittu commented 3 years ago

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 commented 3 years ago

The plugin is probable being rendered server side.

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

Devdre1909 commented 3 years ago

@devshittu

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

AbbyJoe commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

@marvelefe can you share your Nuxt Config?

iamraphson commented 3 years ago

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

marvelefe commented 3 years ago

@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 commented 3 years ago

I'm using Nuxt @iamraphson

iamraphson commented 3 years ago

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

marvelefe commented 3 years ago

Aii. Package looks good. Thanks @iamraphson

yvMuhammed commented 2 years ago

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

devshittu commented 2 years ago

@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 commented 2 years ago

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 commented 2 years ago

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 https://github.com/iamraphson/vue-paystack/issues/26#issuecomment-1055339171, 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: @.***>

devshittu commented 2 years ago

You are welcome @yvMuhammed sorry for the late reply.

On Tue, Mar 1, 2022 at 12:48 PM yvMuhammed @.***> wrote:

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 < https://github.com/iamraphson/vue-paystack/issues/26#issuecomment-1055339171 , 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: @.***>

— Reply to this email directly, view it on GitHub https://github.com/iamraphson/vue-paystack/issues/26#issuecomment-1055344383, or unsubscribe https://github.com/notifications/unsubscribe-auth/AM74MBH3PCOVAA7RSHXRNPTU5X7ZBANCNFSM4UOFIOMA . You are receiving this because you were mentioned.Message ID: @.***>