Hello.
I try to update/reload function (after click and land on page trough <nuxt-link>
), who make pretty background image (I'm using my own npm package: https://www.npmjs.com/package/goodbackground.js) for container with data-background-image
attribute.
On my nuxt.config.js
:
...
build: {
vendor: [
'goodbackground.js'
]
},
...
I use beforeCreate
instance into this index.vue
file:
<template>
<div>
<section data-background-image="/images/projects/background.jpg">
Hello World!
</section>
</div>
</template>
<script>
require('goodbackground.js');
export default {
head () {...},
beforeCreate () {
new GoodBackground().make();
}
}
</script>
But Nuxt.js show me red error page with message:
ReferenceError: document is not defined
at t.value (node_modules/goodbackground.js/goodbackground.min.js:1:1392)
at Object.<anonymous> (node_modules/goodbackground.js/goodbackground.min.js:1:2432)
at e (node_modules/goodbackground.js/goodbackground.min.js:1:163)
at node_modules/goodbackground.js/goodbackground.min.js:1:546
at Object.<anonymous> (node_modules/goodbackground.js/goodbackground.min.js:1:555)
at Module._compile (module.js:556:32)
at Object.Module._extensions..js (module.js:565:10)
at Module.load (module.js:473:32)
at tryModuleLoad (module.js:432:12)
at Function.Module._load (module.js:424:3)
This is simple code of my package: https://github.com/koddr/goodbackground.js/blob/master/src/goodbackground.js
Whats wrong? I don't see this if I reload page (cmd+R).. How to fix it?
<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c119">#c119</a>)</em></sub></div>