vitepress 打包提示 window is not defined

问题

打包执行 npm run docs:build 后提示 ReferenceError: window is not defined

(!) Some chunks are larger than 600 kB after minification. Consider:
- Using dynamic import() to code-split the application
- Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks
- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
✓ building client + server bundles...
✖ rendering pages...
build error:
ReferenceError: window is not defined

原因

这个错误是因为在构建过程中，window 对象未定义。

我在代码中使用了 window 对象，但打包时 window 对象未定义。

const eventBus = mitt();
window.$bus = eventBus; 

解决

1. 可以用 globalThis 来代替 window

globalThis 是一个全局变量，它在所有现代 JavaScript 环境中都可用，包括浏览器和 Node.js

const eventBus = mitt();
window.$bus = eventBus; 
globalThis.$bus = eventBus; 

或者

2. 可以用 typeof window !== "undefined" 来判断当前环境是否为浏览器环境

const eventBus = mitt();
window.$bus = eventBus; 
if (typeof window !== "undefined") { 
  window.$bus = eventBus; 
}