我正在尝试在Vue组件中使用Choices.js。该组件编译成功,但随后触发了错误:
[vue-router]无法解析异步组件默认值: ReferenceError: document is not defined
在浏览器中,我看到:
ReferenceError document is not defined
我认为这与Nuxt.js中的SSR有关?我只需要让Choices.js在客户端上运行,因为我猜它只是一个客户端方面。
nuxt.config.js
build: {
vendor: ['choices.js']
}
AppCountrySelect.vue
<script>
import Choices from 'choices.js'
export default {
name: 'CountrySelect',
created () {
console.log(this.$refs, Choices)
const choices = new Choices(this.$refs.select)
console.log(choices)
}
}
</script>
在经典的Vue中,这个代码可以正常工作,所以我还在努力适应如何让Nuxt.js以这种方式工作。
有任何想法我哪里做错了吗?
谢谢。
<your-component />
文件应该长什么样子?我的YourComponent.vue是这样的:<template><div></div></template> <script> import Plotly from 'plotly.js/dist/plotly' export default {} </script>
,但它仍然以document is not defined
结束。 - Michal Skop{ src: '~/plugins/vue-izitoast', mode: 'client' }
。 - ManuEl Magak<client-only>
替代<no-ssr>
。因为<no-ssr>
已经在 Nuxt v2.9.0 中被弃用了。 - Kazmi