在nuxt中添加plugins时,遇到的问题,Google了大半天才解决,记录下以备忘。
问题描述
自定义plugins,里面引用了jquery,比如pluginA.js:
// plugins/pluginA.js
import $ from 'jquery'
export default function({ app }) {
.....
$('body').append("<div>hello</div>")
.....
}
修改nuxt.config.js
文件,将pluginA.js 加入到plugings中:
// nuxt.config.js
plugins: [
'~/plugins/pluginA'
]
重启后,一直报错:
document is not defined
或者
jQuery requires a window with a document
解决方法
官网window or document undefined? 部分给到了解释:
This is due to the server-side rendering. If you need to specify that you want to import a resource only on > > the client-side.
查看文档plugins , 在 Client-side only部分给到了解决方法,使用option:ssr: false
修改nuxt.config.js文件:
// nuxt.config.js
plugins: [
{ src: '~/plugins/pluginA', ssr: false }
]
重启,OK.
参考
Use jquery error “jQuery requires a window with a document”!