[Nuxt] document not found

Denoder commented 1 year ago

When running naive-ui with inline-theme-disabled an error occurs:

[Vue warn]: Unhandled error during execution of render function 
  at <Layout class="w-full h-screen" has-sider="" >
[nuxt] error caught during app initialization ReferenceError: document is not defined
    at queryElement (/home/ubuntu/main/.output/server/node_modules/css-render/lib/utils.js:17:5)
    at mount (/home/ubuntu/main/.output/server/node_modules/css-render/lib/mount.js:59:52)
    at Object.wrappedMount [as mount] (/home/ubuntu/main/.output/server/node_modules/css-render/lib/c.js:14:45)
    at renderCallback (file:///home/ubuntu/main/.nuxt/dist/server/_nuxt/use-css-vars-class-5be16d4a.js:35:38)
    at Proxy.onRender (file:///home/ubuntu/main/.nuxt/dist/server/_nuxt/use-css-vars-class-5be16d4a.js:48:71)
    at Proxy.render (file:///home/ubuntu/main/.nuxt/dist/server/_nuxt/Layout-5a99573f.js:122:68)
    at renderComponentRoot (/home/ubuntu/main/.output/server/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:906:44)
    at renderComponentSubTree (/home/ubuntu/main/.output/server/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:719:51)
    at renderComponentVNode (/home/ubuntu/main/.output/server/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:644:16)
    at ssrRenderComponent (/home/ubuntu/main/.output/server/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:94:12) {
  statusCode: 500,
  fatal: false,
  unhandled: false,
  statusMessage: undefined,
  __nuxt_error: true
}

the lines in question are:

https://github.com/07akioni/css-render/blob/8f14fd18ac654608ce213fa9830adb193859d455/packages/css-render/src/mount.ts#L117 and https://github.com/07akioni/css-render/blob/8f14fd18ac654608ce213fa9830adb193859d455/packages/css-render/src/utils.ts#L11

this is only specific to Nuxt when running inline-theme-disabled with naive

peterroe commented 1 year ago

same problem...

peterroe commented 1 year ago

Solve：

<ClientOnly>
    // ...
</ClientOnly>

Denoder commented 1 year ago

Solve：

<ClientOnly>
  // ...
</ClientOnly>

This would conflict withe pages that use ssr, and are slotted under a layout cause this is happening to most of the components and the layouts.

peterroe commented 1 year ago

Do you hava a good way to solve it?👀

07akioni / css-render

[Nuxt] document not found #1100