reuse social link icon in custom component

[Sepush]

Is it possible to reuse the social link icon of vitepres in custom components?
like import {Github} from 'vitepress/icon'
Is there already an API?
I found there is icons and support/icones in vitepress client how about expose them

[brc-dd]

We have picked these from https://github.com/simple-icons/simple-icons, you can directly install that.

[brc-dd]

Probably our typings are messed up (created an issue to track it -- #1127). For now, you can consider adding this to your tsconfig.json:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "vitepress/client/*": ["node_modules/vitepress/dist/client/*"]
    }
  },
  "include": ["**/*", "**/*.vue"]
}

[Sepush]

thanks

[Sepush]

this seems broken in alpha8

[brc-dd]

Use:

import VPSocialLinks from 'vitepress/dist/client/theme-default/components/VPSocialLinks.vue'
// or
import VPSocialLinks from '@theme/components/VPSocialLinks.vue'

Second one will work only when you don't have custom theme (also in TS it would need some path alias).

Just a word of caution, this component is internal. We'll likely be changing the way it works in future releases. Currently the bundle includes unused svg codes, we'll probably be transforming the icon name to svg during build for performance reasons. So this component in future will need the svg code. I recommend writing a custom component (and registering it globally for ease).

[Sepush]

got it