VueHooks Plus

English | 简体中文

高性能且简单易用的 Vue3 Hooks 库

</div>

✨ 特性

🏄🏼‍♂️ 易学易用
🔋 支持 SSR
🛸 包含全面的基础 Hooks
🏟️ 广泛的应用场景
🦾 首选 useRequest，强大的请求中间层
🎪 交互式演示，身临其境
🎯 使用 TypeScript 编写，具有可预测的静态类型
🪄 支持按需加载，减少打包体积
🤺 Playground，充分发挥你的能力
🔐 完善的测试，安全可靠

📦 安装

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'

自动导入

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()],
  })

<details> <summary>Webpack</summary><br>

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()],
    }),
  ],
}