v-scroll-lock icon indicating copy to clipboard operation
v-scroll-lock copied to clipboard

Not working with Nuxt SSR

Open chiptoma opened this issue 5 years ago • 5 comments

I tried to integrate it with Nuxt but apparently, it's not SSR compatible. Could it be modified to work with Nuxt? Thanks

chiptoma avatar Jan 14 '19 18:01 chiptoma

+1

mayank-shaan avatar Jan 16 '19 09:01 mayank-shaan

I managed to get it working as a client plugin, however since this package directly references the window which is not available on the server side when rendering it will throw errors when trying to run on the server side.

plugins/v-scroll-lock.ts

import Vue from "vue";
import VScrollLock from "v-scroll-lock";

Vue.use(VScrollLock);

nuxt.config.ts

  plugins: [
    { src: "~/plugins/v-scroll-lock", mode: "client" },
  ],

wSedlacek avatar Feb 06 '19 07:02 wSedlacek

Im using the Gridsome Site Generator. Everything works fine in Dev-Mode. But when using the build mode i also experience the following error:

Failed to render / ReferenceError: window is not defined at Object.<anonymous> (node_modules/v-scroll-lock/dist/v-scroll-lock.js:10:1) at __webpack_require__ (webpack/bootstrap:25:0) at Module.<anonymous> (assets/js/app.59f3b7d5.js:7596:21) at __webpack_require__ (webpack/bootstrap:25:0) at Module.<anonymous> (node_modules/gridsome/app/main.js:4:9) at __webpack_require__ (webpack/bootstrap:25:0) at Object.<anonymous> (assets/js/app.59f3b7d5.js:3811:18) at __webpack_require__ (webpack/bootstrap:25:0) at assets/js/app.59f3b7d5.js:118:18 at Object.<anonymous> (assets/js/app.59f3b7d5.js:121:10)

herrstn avatar Jul 10 '19 14:07 herrstn

getting the same issues with Nuxt SSR

GunnarPDX avatar Nov 24 '19 06:11 GunnarPDX

It's not working on Nuxt SSR

I tried to import the same source code in this git repo, but it failed. getting error below


ERROR Failed to compile with 1 errors friendly-errors 23:04:28

ERROR in ./plugins/test.ts friendly-errors 23:04:28

Module parse failed: Unexpected token (5:8) friendly-errors 23:04:28 You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | import VScrollLockInterface from './interfaces/v-scroll-lock.interface' |

declare global { | interface Window { | Vue?: VueConstructor friendly-errors 23:04:28 @ ./plugins/vue-scroll-lock.js 2:0-36 3:8-19 @ ./.nuxt/index.js @ ./.nuxt/client.js @ multi ./node_modules/eventsource-polyfill/dist/browserify-eventsource.js (webpack)-hot-middleware/client.js?reload=true&timeout=30000&ansiColors=&overlayStyles=&path=%2F__webpack_hmr%2Fclient&name=client ./.nuxt/client.js

naeul-lee avatar Dec 11 '21 14:12 naeul-lee