Nuxt.js中的“未定义窗口”

vue.js Vue.js

GilA

2020-03-23

从Vue.js移植到Nuxt.js时出现错误。

我想用vue-sessionnode_modules编译成功,但是在浏览器中看到错误:

未定义ReferenceError窗口

node_modules\vue-session\index.js

VueSession.install = function(Vue, options) {
    if (options && 'persist' in options && options.persist) STORAGE = window.localStorage;
    else STORAGE = window.sessionStorage;
    Vue.prototype.$session = {
        flash: {
          parent: function() {
            return Vue.prototype.$session;
          },

因此,我遵循此文档

rewardadd.vue

import VueSession from 'vue-session';

Vue.use(VueSession);

if (process.client) {
  require('vue-session');
}

nuxt.config.js

  build: {
    vendor: ['vue-session'],

但是我仍然不能解决这个问题。

第2786篇《Nuxt.js中的“未定义窗口”》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

2个回答
神无宝儿达蒙 2020.03.23

Nuxt.js是服务器端渲染的,服务器端不存在Windows。您可以在Vue.js服务器端渲染指南中阅读有关内容

Gil伽罗小宇宙 2020.03.23

服务器端呈现端没有窗口对象。但是快速的解决方法是检查process.browser

  created(){
    if (process.browser){
      console.log(window.innerWidth, window.innerHeight);
    }
  }

这有点草率,但是有效。这是有关如何使用插件更好地完成工作的不错的文章

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android