如何在Nuxt 3项目中导入并配置Oh Vue Icons？

在Nuxt 3里不需要直接修改nuxt.config.ts来配置Oh Vue Icons，而是通过自定义插件实现和常规Vue项目main.ts里相同的效果，具体步骤如下：

1. 确保已安装依赖
   如果还没安装，先执行对应命令：

npm install oh-vue-icons
# 或使用yarn/pnpm
yarn add oh-vue-icons
pnpm add oh-vue-icons

2. 创建插件文件
   在项目根目录的plugins文件夹下新建一个文件，比如oh-vue-icons.ts（Nuxt会自动扫描该目录下的插件文件，文件名可自定义）。

3. 写入配置代码
   在新建的插件文件中复制以下代码，和你原来main.ts的逻辑完全对应：

import { OhVueIcon, addIcons } from 'oh-vue-icons'
import { MdDragindicator, HiTrash, HiPlus, HiSolidSearch, BiTextLeft, BiTypeH1, BiTypeH2, BiTypeH3, BiHr, BiQuote } from 'oh-vue-icons/icons'

// 添加需要用到的图标
addIcons(MdDragindicator, HiTrash, HiPlus, HiSolidSearch, BiTextLeft, BiTypeH1, BiTypeH2, BiTypeH3, BiHr, BiQuote)

export default defineNuxtPlugin((nuxtApp) => {
  // 全局注册<v-icon>组件
  nuxtApp.vueApp.component('v-icon', OhVueIcon)
})

4. 直接使用图标
   完成上述步骤后，你就可以在任意Nuxt页面或组件里像之前一样使用<v-icon>组件了，示例：

<v-icon name="hi-trash" />
<v-icon name="bi-type-h1" />

内容的提问来源于stack exchange，提问作者Patrick