跳到内容
+

安装

安装 Joy UI,一个设计精美的 React UI 组件库。

默认安装

运行以下命令之一将 Joy UI 添加到您的项目

npm install @mui/joy @emotion/react @emotion/styled

对等依赖

请注意,reactreact-dom 是对等依赖,这意味着您应确保在安装 Joy UI 之前安装它们。

"peerDependencies": {
  "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
  "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
},

Inter 字体

Joy UI 默认使用 Inter 字体。通过 Fontsource 或 Google Fonts CDN 将其添加到您的项目中。

Fontsource

运行以下命令之一,通过 Fontsource 将 Inter 添加到您的 Joy UI 项目中

npm install @fontsource/inter

然后您可以像这样在您的入口点导入它

import '@fontsource/inter';

Google Web Fonts

要通过 Google Web Fonts CDN 安装 Inter,请将以下代码添加到您项目的 <head /> 标签内

<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
  rel="stylesheet"
  href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap"
/>