The code-group does not work

[qcyblm]

• I confirm that this is an issue rather than a question.

Bug report

Steps to reproduce

1. git clone https://gitee.com/qcyblm/qcyblm.git
2. yarn init
3. yarn add -D vuepress
4. yarn docs:dev
5. open http://localhost:8080/
6. yarn docs:build
7. git add . && git commit -m 'Update the document' && git push
8. Update Gitee Pages
9. open https://qcyblm.gitee.io/

What is expected?

Use code-group in the home page.

What is actually happening?

Preview on the local

Preview on the web

Other relevant information

• Output of npx vuepress info in my VuePress project:

Environment Info:

  System:
    OS: Linux 5.4 UnionTech OS Desktop 20 Home 20 Home
    CPU: (4) x64 Intel(R) Core(TM) i5-4670T CPU @ 2.30GHz
  Binaries:
    Node: 15.0.1 - /usr/local/node/bin/node
    Yarn: 1.22.10 - /media/qcyblm/_dde_data/Workspace/node/node_global/bin/yarn
    npm: 7.0.3 - /usr/local/node/bin/npm
  Browsers:
    Chrome: 86.0.4240.111
    Firefox: Not Found
  npmPackages:
    @vuepress/core:  1.7.1 
    @vuepress/theme-default:  1.7.1 
    vuepress: ^1.7.1 => 1.7.1 
  npmGlobalPackages:
    vuepress: Not Found

[Amoki]

I'm facing the same problem. It works when navigating on the website but does not when it's on the first loaded page. I assume it's an SSR problem

[Kurtil]

If it is a server-side bug, using ClientOnly may be a good workaround.

<ClientOnly>
  <code-group>
  ...
  </code-group>
</ClientOnly>