LobeChatLobeHub
UI
Components
Chat
Mobile
Awesome
Brand
Mdx
Color
Changelog
Ctrl K
General
ActionIcon
ActionIconGroup
Icon
FileTypeIcon
MaterialFileTypeIcon
Data Display
Avatar
Collapse
EmptyCard
FluentEmoji
Highlighter
Image
List
Markdown
Mermaid
Snippet
SortableList
Tag
Tooltip
Video
Data Entry
CodeEditor
ContextMenu
CopyButton
EditableText
EmojiPicker
Form
FormModal
Input
SearchBar
SelectWithImg
SliderWithInput
Swatches
ThemeSwitch
Feedback
Alert
Modal
Layout
DraggablePanel
Footer
Grid
Header
Layout
Navigation
Burger
SideNav
TabsNav
Toc
Theme
ConfigProvider
FontLoader
ThemeProvider

ConfigProvider

The proxy provides two CDN resolution addresses, aliyun and unpkg, with aliyun as the default. This can be configured through the cdn attribute of ConfigProvider.

import { ConfigProvider } from '@lobehub/ui';
NPM
UNPKG
BundlePhobia
PackagePhobia
Anvaka Graph
Source
Edit
Previous
Toc
Next
FontLoader

Resources

Lobe UI-AIGC Components
Lobe Icon-AI / LLM Icon Collection
Lobe Charts-Modern Charts
Lobe TTS-TTS / STT Library

Community

Report Bug
Request Feature

Help

GitHub
Changelog

More Products

🤯 Lobe Chat-AI / LLM Chat Framework
🧸 Lobe Vidol-Virtual Idols for EveryOne
🅰️ Lobe Theme-Stable Diffusion Extension
🌐 Lobe i18n-AI i18next CLI
Copyright © 2022-2025
Made with 🤯 by LobeHub
LobeHub

Default

The proxy provides two CDN resolution addresses, aliyun and unpkg, with aliyun as the default. This can be configured through the cdn attribute of ConfigProvider.

Custom CDN

At the same time, it provides custom CDN configuration, set proxy to custom and configure through the customCdnFn attribute.

ts
import { ConfigProvider, Logo } from '@lobehub/ui';

export default () => {
  return (
    <ConfigProvider config={{
        proxy: 'custom',
        customCdnFn: (e: {pkg:string, version:string, path:string}) => `https://yourcdn/${pkg}/${version}/${path}`
    }}>
      <Logo />
    </ConfigProvider>
  );
};

APIs

NameDescriptionTypeDefault
children--ReactNode--
config--{aAs?:symbol|object|ComponentClass|FunctionComponent|text|style|slot|title|th|tr|search|article|button|dialog|figure|form|img|link|main|menu|menuitem|option|switch|table|small|circle|time|center|a|abbr|address|area|aside|audio|b|base|bdi|bdo|big|blockquote|body|br|canvas|caption|cite|code|col|colgroup|data|datalist|dd|del|details|dfn|div|dl|dt|em|embed|fieldset|figcaption|footer|h1|h2|h3|h4|h5|h6|head|header|hgroup|hr|html|i|iframe|input|ins|kbd|keygen|label|legend|li|map|mark|meta|meter|nav|noindex|noscript|ol|optgroup|output|p|param|picture|pre|progress|q|rp|rt|ruby|s|samp|script|section|select|source|span|strong|sub|summary|sup|template|tbody|td|textarea|tfoot|thead|track|u|ul|var|video|wbr|webview|svg|animate|animateMotion|animateTransform|clipPath|defs|desc|ellipse|feBlend|feColorMatrix|feComponentTransfer|feComposite|feConvolveMatrix|feDiffuseLighting|feDisplacementMap|feDistantLight|feDropShadow|feFlood|feFuncA|feFuncB|feFuncG|feFuncR|feGaussianBlur|feImage|feMerge|feMergeNode|feMorphology|feOffset|fePointLight|feSpecularLighting|feSpotLight|feTile|feTurbulence|filter|foreignObject|g|image|line|linearGradient|marker|mask|metadata|mpath|path|pattern|polygon|polyline|radialGradient|rect|set|stop|textPath|tspan|use|view;customCdnFn?:(__0:any)=>string;imgAs?:symbol|object|ComponentClass|FunctionComponent|text|style|slot|title|th|tr|search|article|button|dialog|figure|form|img|link|main|menu|menuitem|option|switch|table|small|circle|time|center|a|abbr|address|area|aside|audio|b|base|bdi|bdo|big|blockquote|body|br|canvas|caption|cite|code|col|colgroup|data|datalist|dd|del|details|dfn|div|dl|dt|em|embed|fieldset|figcaption|footer|h1|h2|h3|h4|h5|h6|head|header|hgroup|hr|html|i|iframe|input|ins|kbd|keygen|label|legend|li|map|mark|meta|meter|nav|noindex|noscript|ol|optgroup|output|p|param|picture|pre|progress|q|rp|rt|ruby|s|samp|script|section|select|source|span|strong|sub|summary|sup|template|tbody|td|textarea|tfoot|thead|track|u|ul|var|video|wbr|webview|svg|animate|animateMotion|animateTransform|clipPath|defs|desc|ellipse|feBlend|feColorMatrix|feComponentTransfer|feComposite|feConvolveMatrix|feDiffuseLighting|feDisplacementMap|feDistantLight|feDropShadow|feFlood|feFuncA|feFuncB|feFuncG|feFuncR|feGaussianBlur|feImage|feMerge|feMergeNode|feMorphology|feOffset|fePointLight|feSpecularLighting|feSpotLight|feTile|feTurbulence|filter|foreignObject|g|image|line|linearGradient|marker|mask|metadata|mpath|path|pattern|polygon|polyline|radialGradient|rect|set|stop|textPath|tspan|use|view;imgUnoptimized?:boolean;proxy?:any}(required)
LobeHub