vue中使用window对象_nuxt.js在vue组件中使用window对象编译报错的解决方法

最近在忙着写自己的个人网站，因为不想做同时兼容PC端和移动端的UI，所以想做两套，一个采用elementUI做移动端UI，一个用bootstrapvue做PC端UI，所以需要在首页判断是否是手机环境，但是我在vue组件中使用是编译却不能通过，最终查询资料得到解决方法。

因为nuxt为SSR框架，所以其编译打包时会区分服务端渲染还是客户端渲染(即浏览器)，在vue文件中使用window对象报错的原因是，webpack将其加入了服务端脚本中，所以会报错。所以在使用时，应该判断当前代码环境是否是浏览器环境。

官方给出的：process.BROWSER_BUILD，通过判断再使用window对象，但是本人亲测没用。。。

if (process.BROWSER_BUILD) {

console.log(window)

}

最后通过查阅资料发现在Nuxt v1.0.0版本 process.BROWSER_BUILD 已经被摒弃了，转而代替的是process.browser，所以最终实现代码如下：

beforeCreate() {

if (process.browser) {

if ((window.navigator.userAgent.match(/(iPhone|iPod|Android|ios|iOS|iPad|Backerry|WebOS|Symbian|Windows Phone|Phone)/i))) {

window.location = '/mobile'

}

}

},