docs: support vitepress vp-code-group (#18869)

* feat(style): support vitepress vp-code-group

* docs: update

* docs: update

docs/.vitepress/theme/index.ts

@@ -7,6 +7,7 @@ import VPApp, { NotFound, globals } from '../vitepress'
 import { define } from '../utils/types'
 import 'uno.css'
 import './style.css'
+import 'vitepress/dist/client/theme-default/styles/components/vp-code-group.css'
 import type { Theme } from 'vitepress'
 
 export default define<Theme>({

docs/en-US/component/icon.md

@@ -17,16 +17,21 @@ Element Plus provides a set of common icons.
 
 ### Using packaging manager
 
-```shell
-# Choose a package manager you like.
+Choose a package manager you like.
 
-# NPM
+::: code-group
+```shell [npm]
 $ npm install @element-plus/icons-vue
-# Yarn
+```
+
+```shell [yarn]
 $ yarn add @element-plus/icons-vue
-# pnpm
+```
+
+```shell [pnpm]
 $ pnpm install @element-plus/icons-vue
 ```
+:::
 
 ### Register All Icons
 

docs/en-US/guide/installation.md

@@ -44,19 +44,24 @@ In addition, every commit and PR on the dev branch will be published to [pkg.pr.
 so that you can utilize bundlers like [Vite](https://vitejs.dev) and
 [webpack](https://webpack.js.org/).
 
-```shell
-# Choose a package manager you like.
 
-# NPM
+Choose a package manager you like.
+
+::: code-group
+
+```shell [npm]
 $ npm install element-plus --save
-
-# Yarn
+```
+```shell [yarn]
 $ yarn add element-plus
+```
 
-# pnpm
+```shell [pnpm]
 $ pnpm install element-plus
 ```
 
+:::
+
 If your network environment is not good, it is recommended to use a mirror registry [cnpm](https://github.com/cnpm/cnpm) or [npmmirror](https://npmmirror.com/).
 
 ```shell