Open Aztriltus opened 4 years ago
You should wrap you code with nuxt’s client-only component
You should wrap you code with nuxt’s client-only component
It doesn't work because it crashes during import
"dependencies": {
"@nuxt/typescript-runtime": "^2.0.0",
"@nuxtjs/axios": "^5.12.2",
"core-js": "^3.6.5",
"nuxt": "^2.14.5",
"vue-telegram-login": "^2.1.0"
}
I followed and official FAQ suggestion:
<template>
<client-only placeholder="Loading...">
<vue-telegram-login
mode="callback"
telegram-login="TrembolGameBot"
@callback="yourCallbackFunction"
/>
</client-only>
</template>
<script>
let vueTelegramLogin
if (process.client) {
vueTelegramLogin = require('vue-telegram-login').vueTelegramLogin
console.log(vueTelegramLogin)
} else {
vueTelegramLogin = null
}
export default {
name: 'TelegramLogin',
components: {
vueTelegramLogin,
},
methods: {
yourCallbackFunction(user) {
// gets user as an input
// id, first_name, last_name, username,
// photo_url, auth_date and hash
console.log(user)
},
},
}
</script>
vue-telegram-login
version: 2.1.0node
version: 12.8.1npm
(oryarn
) version: yarn 1.17.3Relevant code or config
What you did: I'm using Nuxt 2.0.0 and I tried using this plugin in one of my pages component.
What happened:
window is not defined
Problem description: Seems like the window issue is caused by the client/server configuration. window is only available on the client side and the error is likely caused by the server rendering (which has no window)
Any idea how to solve this?