Happy-Coding-Clans / vue-easytable

A powerful data table based on vuejs. You can use it as data grid、Microsoft Excel or Google sheets. It supports virtual scroll、cell edit etc.
https://happy-coding-clans.github.io/vue-easytable/
MIT License
3.63k stars 725 forks source link

[Bug Report] Since 2.12 SSR is broken #437

Open nekdolan opened 2 years ago

nekdolan commented 2 years ago

选择要提交 issue 的库

vue-easytable

Issue 类型

Bug

Issue 标题

Since 2.12 SSR is broken

仓库版本

2.12.0

Vue 版本

2.6.14

浏览器

Firefox

系统类型

Linux

重现链接

render with Nuxt SSR

重现步骤

Because there are no globals (document) in SSR mode vue-easytable can no longer be rendered on server side (I am therefore stuck with version 2.11.0 that still works)

期望的结果是什么?

The page should render in SSR

实际的结果是什么?

Fatal error during render

huangshuwei commented 2 years ago

Sorry, I'm not familiar with Nuxt. I need to take some time to this problem

nekdolan commented 2 years ago

I've made a sandbox with nuxt: https://codesandbox.io/s/nuxt-playground-forked-h4lx0

ERROR  [Vue warn]: Error in render: "ReferenceError: document is not defined"

found in

---> <VeTable>
       <Pages/index.vue> at pages/index.vue
         <Nuxt>
           <Default> at layouts/default.vue

Basically browser globals such as window or document should not be used during the initial render as those globals are missing on the server.

See: https://nuxtjs.org/docs/concepts/server-side-rendering/#server-vs-browser-environments

huangshuwei commented 2 years ago

Thank you for your feedback. It's useful for positioning problems.

Aruelius commented 2 years ago

nuxt.config.jsplugins 可以写成这样: plugins: [{ src: "~/plugins/ve-table", ssr: false }] 或者 plugins: [{ src: "~/plugins/ve-table", mode: 'client' }]