ReferenceError: navigator is not defined

[loggerhead]

When I build json4u, I got a navigator is not defined error, and I tried the solution at #74 , but it not works for me. How can I resolve the problem?

[vite-ssg] An internal error occurred.
[vite-ssg] Please report an issue, if none already exists: https://github.com/antfu/vite-ssg/issues
json4u/node_modules/codemirror/lib/codemirror.js:18
  var userAgent = navigator.userAgent;
                  ^

ReferenceError: navigator is not defined
    at json4u/node_modules/codemirror/lib/codemirror.js:18:19
    at json4u/node_modules/codemirror/lib/codemirror.js:11:83
    at Object.<anonymous> (json4u/node_modules/codemirror/lib/codemirror.js:14:2)
    at Module._compile (node:internal/modules/cjs/loader:1097:14)

[loggerhead]

Resolved by some changes:

MyCompent.vue

<script setup lang="ts">
import { onMounted } from "vue";
import Editor from "../utils/editor";

let leftEditor = new Editor();
let rightEditor = new Editor();

onMounted(async () => {
  // important!
  if (typeof window === "undefined") {
    return;
  }

  // dynamic import CodeMirror packages
  await leftEditor.setupCM("left-editor");
  await rightEditor.setupCM("right-editor");

  window.addEventListener("keydown", (e) => {
    // ...
  });
});
</script>

../utils/editor.ts

import { Ref } from "vue";
import "codemirror/lib/codemirror.css";
import "codemirror/theme/idea.css";
import "codemirror/addon/fold/foldgutter.css";
import "codemirror/addon/lint/lint.css";

export default class Editor {
  cm: CodeMirror.Editor;

  constructor() {
    this.cm = <CodeMirror.Editor>(<unknown>null);
  }

  async setupCM(id: string) {
    var CodeMirror = await import("codemirror");
    // @ts-ignore
    await import("codemirror/mode/javascript/javascript.js");
    await import("codemirror/addon/display/placeholder.js");
    await import("codemirror/addon/fold/foldgutter.js");
    await import("codemirror/addon/fold/foldcode.js");
    await import("codemirror/addon/fold/brace-fold.js");
    await import("codemirror/addon/lint/lint.js");
    await import("codemirror/addon/lint/json-lint.js");
    // @ts-ignore
    (window as any).jsonlint = await import("jsonlint-mod");

    const el = document.getElementById(id) as HTMLTextAreaElement;
    const cm = CodeMirror.fromTextArea(el, {
      mode: "application/json",
      theme: "idea",
      smartIndent: true,
      lineNumbers: true,
      foldGutter: true,
      gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter", "CodeMirror-lint-markers"],
    });

    this.cm = cm;
    return this;
  }
}

main.ts

import { ViteSSG } from "vite-ssg/single-page";
import App from "./App.vue";

// export 'createApp' is important!
export const createApp = ViteSSG(App);