在 React 中安装 boxicons

Boxicons是一组开源的矢量图标集合，可以方便地在 Web 和移动应用程序中使用。在本文中，我们将介绍如何在 React 项目中安装 boxicons。

1. 安装 boxicons

首先，我们需要在项目中安装 boxicons。在终端中，使用以下命令：

npm install boxicons --save

2. 导入 boxicons

接下来，在您的组件中导入 boxicons。在组件文件的开头添加以下行：

import 'boxicons/css/boxicons.min.css';

这将导入 boxicons 的样式文件，并使其在您的应用程序中可用。

3. 使用 boxicons

一旦您导入了 boxicons，您就可以在组件中使用它们了。例如，在下面的代码片段中，我们将使用“bx-bell“图标：

import React from 'react';
import './App.css';
import 'boxicons/css/boxicons.min.css';

function App() {
  return (
    <div className="App">
      <box-icon name='bell'></box-icon>
      <h1>Welcome to my App!</h1>
    </div>
  );
}

export default App;

注意，“bx-”前缀指示 boxicons 类别，例如“bx-bell”表示提醒图标。

以上就是在 React 中安装和使用 boxicons 的全部步骤。如果您需要使用其他 boxicons 图标，请参考 boxicons 文档。

参考链接：https://boxicons.com/