vitepress: hydration mismatch when using auto minify

Describe the bug

I built and published vitepress pages to my server, but got Hydration completed but contains mismatches error when i review, and the index page rendered nothing but blank, and other pages show correctlly.

But it runs perfectly on my local within dev mode

Reproduction

• type run npm docs:build and wait.
• zip all release files under destination folder and push it to server
• unzip and place to the nginx root folder
• visit the site

Expected behavior

the index page displays correctlly.

System Info

System:
    OS: macOS 11.4
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
    Memory: 1.22 GB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.15.1 - /usr/local/opt/nvm/versions/node/v14.15.1/bin/node
    Yarn: 1.22.10 - /usr/local/opt/nvm/versions/node/v14.15.1/bin/yarn
    npm: 6.14.8 - /usr/local/opt/nvm/versions/node/v14.15.1/bin/npm
  Browsers:
    Chrome: 92.0.4515.131
    Safari: 14.1.1
  npmPackages:
    vitepress: ^0.16.1 => 0.16.1

Additional context

vitepress v0.16.1
vite v2.4.4
⠴ building client + server bundles...Use of eval is strongly discouraged, as it poses security risks and may cause issues with minification
⠦ building client + server bundles...Use of eval is strongly discouraged, as it poses security risks and may cause issues with minification
⠸ building client + server bundles...
(!) Some chunks are larger than 500kb after minification. Consider:
- Using dynamic import() to code-split the application
- Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/guide/en/#outputmanualchunks
- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
✓ building client + server bundles...
⠙ rendering pages...Warning: Setting up fake worker.
Error: Setting up fake worker failed: "document is not defined".
    at /Users/mpanda/Documents/GitHub/MPC-Documention/node_modules/vitepress/dist/client/app/temp/assets/mpc.umd.7d0f3985.js:41728:54
✓ rendering pages...
build complete in 25.90s.

I do get some warning when runing build process, my vue components library depends to PDF.js and some of my customized directives are using document for creting DOM, I’m not sure if it due to SSR of vitpress.

And following are the configuration of my vitepress project.

docs/.vitepress/config.js

const vue = require('@vitejs/plugin-vue')
// import { Options as VuePluginOptions } from '@vitejs/plugin-vue'
const ssrTransformCustomDir = () => {
  return {
    props: [],
    needRuntime: true,
  }
}
module.exports = {
  title: 'MpandaStudio Components Library', // 顶部左侧标题
  base: '/', // 项目的根路径
  lang: 'zh-CN',
  head: [
    // 设置 描述 和 关键词
    [
      'meta',
      {
        name: 'keywords',
        content:
          'MPanda Studio Vue3 UI Components Library/MPanda Studio Vue3 UI组件库',
      },
    ],
    [
      'meta',
      {
        name: 'description',
        content:
          '此UI组件库基于Vue3开发, 从之前开发的项目中提取并转换为Vue3组件。',
      },
    ],
  ],
  themeConfig: {
    sidebar: {
      // 侧边栏
      '/': [
        {
          text: 'Introduction 介绍',
          children: [
            { text: "What's MPC 什么是MPC？", link: '/' },
            { text: 'Start 从起步到芜湖', link: '/guide/start' },
            // { text: "Configuration 文件配置", link: "/guide/configuration" },
          ],
        },
        {
          text: 'Components 组件',
          children: [
            { text: 'Card 卡片', link: '/guide/Components/Card' },
            { text: 'Carousel 轮播图', link: '/guide/Components/Carousel' },
            { text: 'Modal 弹窗', link: '/guide/Components/Modal' },
            {
              text: 'PDFReader PDF阅读器',
              link: '/guide/Components/PDFReader',
            },
          ],
        },
        {
          text: 'Directives 命令',
          children: [
            { text: 'Suspend 悬浮', link: '/guide/Directives/Suspend' },
            { text: 'Tooltips 提示框', link: '/guide/Directives/Tooltips' },
            { text: 'Blur 模糊', link: '/guide/Directives/Blur' },
          ],
        },
        {
          text: 'Utils 工具包',
          children: [
            {
              text: 'isElementInViewport ',
              link: '/guide/Utils/isElementInViewport',
            },
          ],
        },
      ],
    },
    nav: [
      // 顶部右侧导航栏
      { text: '介绍', link: '/', activeMatch: '^/$|^/guide/' },
      {
        text: '更多',
        link: '/contact/',
      },
    ],
  },
  vue: { 
    template: {
      compilerOptions: {
        directiveTransforms: {
          tooltips: ssrTransformCustomDir,
          suspend: ssrTransformCustomDir,
          blur: ssrTransformCustomDir,
        },
      },
    },
  },
}

docs/.vitepress/theme/index.js

import DefaultTheme from 'vitepress/theme'
import MPC from '@mpanda/mpc'
import '@mpanda/mpc/lib/mpc.css'
export default {
  ...DefaultTheme,
  enhanceApp({ app }) {
    app.use(MPC)
  }
}

Validations

• Follow our Code of Conduct
• Read the docs.
• Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.