Wysimark could not be compiled with `vite-ssg`

Describe the bug

Hello everyone. I have started to use vite ssr and ssg in my project now and decided to integrate porsive/wysimark into the project. But it does not seem to work around the concept of ssg and ssr. It keeps saying document is not defined during the build and won't compile at all.

I have tried

Wrapping the <Wysimark /> component with <ClientOnly />
Add the module into ssr.noExternal in vite.config.ts
Register the Wysimark component globally after isClient is true.

This is the repository for some minimal reproduction code.

This is the error that happened when building the page

[vite-ssg] An internal error occurred.
[vite-ssg] Please report an issue, if none already exists: https://github.com/antfu/vite-ssg/issues
file:///D:/coding-projects/rfcx/vue-wysimark-vite-ssg/.vite-ssg-temp/fyqzbzosyf/main.mjs:86843
var ad = document.createElement("i");
         ^

ReferenceError: document is not defined
    at file:///D:/coding-projects/rfcx/vue-wysimark-vite-ssg/.vite-ssg-temp/fyqzbzosyf/main.mjs:86843:10
    at ModuleJob.run (node:internal/modules/esm/module_job:194:25)

My vite.config.ts that caused this error

import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue()
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  ssgOptions: {
    script: 'async',
    includedRoutes (_paths, _routes) {
      return ['about', 'home']
    }
  },
  ssr: {
    noExternal: [
      '@wysimark/vue'
    ]
  }
})

This is how I used the module inside the page.

<template>
  <ClientOnly>
    <Wysimark v-model="markdown" :height="300" />
  </ClientOnly>
</template>

<script setup lang="ts">
import Wysimark from '@wysimark/vue'
import { ref } from 'vue'

const markdown = ref('')
</script>

Thank you for this awesome module and please reply in the page if you want further clarification.

Reproduction

https://github.com/grindarius/vue-with-wysimark-and-vite-ssg

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 AMD Ryzen 5 1600 Six-Core Processor
    Memory: 18.62 GB / 31.94 GB
  Binaries:
    Node: 18.17.1 - C:\Program Files\nodejs\node.EXE
    npm: 9.6.7 - C:\Program Files\nodejs\npm.CMD
    pnpm: 8.8.0 - ~\AppData\Local\pnpm\pnpm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0)
    Internet Explorer: 11.0.19041.1566

Used Package Manager

pnpm

Validations

[X] Follow our Code of Conduct
[X] Read the Contributing Guide.
[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
[X] The provided reproduction is a minimal reproducible of the bug.

antfu-collective / vite-ssg