VueHooks Plus

English | 简体中文

高性能 & 简约的 Vue3 Hooks 库

✨ 特性

• 🏄🏼‍♂️ 易学易用
• 🔋 支持 SSR
• 🛸 丰富的 Hooks
• 🏟️ 覆盖大部分业务场景
• 🦾 首选 useRequest，强大的请求中间层
• 🎪 交互式 demo，身临其境
• 🎯 使用 TypeScript 构建，提供完整的类型定义文件
• 🪄 支持按需加载，减少打包体积
• 🤺 演练场，大有用武之地
• 🔐 测试完善，安全可靠

📦 安装

npm i vue-hooks-plus

CDN

<script src="https://cdn.jsdelivr.net/npm/vue-hooks-plus/dist/js/index.iife.js"></script>

它会导出一个全局的变量 VueHooks_Plus

🤹‍♀️ 使用

import { useRequest } from 'vue-hooks-plus'

按需加载

import useRequest from 'vue-hooks-plus/es/useRequest'

自动引入

Vite

import AutoImport from 'unplugin-auto-import/vite'
import { VueHooksPlusResolver } from '@vue-hooks-plus/resolvers'

export const AutoImportDeps = () =>
  AutoImport({
    imports: ['vue', 'vue-router'],
    include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/, /\.md$/],
    dts: 'src/auto-imports.d.ts',
    resolvers: [VueHooksPlusResolver()],
  })

Webpack

const { VueHooksPlusResolver } = require('@vue-hooks-plus/resolvers')
module.exports = {
  /* ... */
  plugins: [
    require('unplugin-auto-import/webpack')({
      imports: ['vue', 'vue-router'],
      include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/, /\.md$/],
      dts: 'src/auto-imports.d.ts',
      resolvers: [VueHooksPlusResolver()],
    }),
  ],
}

其他支持的工具, 更多请看 unplugin-auto-import

国际化文档

• English Documentations
• 中文文档

例子

• Vue Admin Novel
• Nuxt 3
• Vite + Vue 3
• Webpack + Vue 3

🤩 惊叹的 Used by

模版

• Ray Template

🪴 项目活动

贡献

欢迎你的加入！你可以查阅 贡献指南 了解如何开始。

贡献者

感谢他们的所做的一切贡献 🐝 ！

🌸 感谢

这个项目的灵感主要来自于以下这些很棒的项目。

• ahooks
• @koale/useworker

📄 证书

MIT License © 2022-PRESENT YongGit