app.use 是 Vue3 挂载插件的唯一标准方式，必须在 app.mount() 前调用，接收插件函数或含 install 方法的对象及可选配置，支持链式调用与自动去重。
Vue3 中的 app.use 是挂载插件的唯一标准方式，所有官方和第三方库（比如 Vue Router、Pinia、Element Plus）都必须通过它接入应用。它不是“可选操作”，而是功能注入的前提——没调用 app.use()，插件根本不会生效。
app.use 的基本用法和关键规则
它接收两个参数：插件本身（函数或含 install 方法的对象），以及可选的配置对象。必须在 app.mount() 之前执行，否则插件无法完成初始化。
- 顺序不能错：先
app.use(插件)，再app.mount() - 支持链式调用：
app.use(router).use(store).use(uiLib) - 重复调用同一插件会被自动忽略（内部用 Set 去重）
- 插件必须导出为函数，或具有
install(app, options)方法的对象
挂载 Vue Router 的标准流程
以 Vue Router 4 为例，安装后需在 main.js 或 main.ts 中完成注册：
- 导入已创建好的路由实例（通常来自
src/router/index.js） - 直接传入
app.use(router)，无需额外参数 - 路由实例内部已封装好
install方法，会自动注册全局组件（<router-link>、<router-view>）、指令和组合式 API（useRouter、useRoute）
示例代码：
立即学习“前端免费学习笔记（深入）”；
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
const app = createApp(App)
app.use(router) // ✅ 关键一步
app.mount('#app')
挂载状态管理库（如 Pinia）
Pinia 同样遵循插件规范，但需注意：它的 createPinia() 返回的是一个插件实例，不是普通对象。
- 调用
createPinia()得到 pinia 实例 - 将该实例传给
app.use()，而不是直接 import 默认导出 - 后续组件中才能使用
useStore等组合式 API
示例：
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
const app = createApp(App)
const pinia = createPinia()
app.use(pinia) // ✅ 不是 app.use(createPinia())
app.mount('#app')
挂载 UI 库或自定义插件
像 Element Plus、Ant Design Vue 这类 UI 库，通常提供 app.use(ElMessage) 或 app.use(ElementPlus) 入口。部分库还支持按需引入 + 插件注册。
- 确认文档是否要求调用
app.use()（多数现代 UI 库需要） - 有些插件需传入配置对象，例如：
app.use(i18n, { locale: 'zh-CN' }) - 自定义插件可统一管理权限、请求拦截、全局指令等，结构清晰且复用性强
小提示：如果插件没生效，优先检查三点——是否漏掉 app.use()、是否写在 mount() 之后、插件导出格式是否符合规范。
