vue3+vite项目通过unplugin-auto-import插件实现自动引入

 未使用时需要手动引入ref、reactive等

使用后无需手动引入

步骤如下：

1.安装依赖

npm i -D unplugin-auto-import

2.修改vite.config.js配置

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import AutoImport from "unplugin-auto-import/vite";

export default defineConfig({
  plugins: [
    vue(),
    AutoImport({
      imports: ["vue", "vue-router", "pinia", "vue-i18n"],
      dts: "src/auto-imports.d.ts",
      dirs: ["src/composables", "src/stores"],
    }),
  ],
  resolve: {
    alias: {
      "@": "/src",
    },
  },
});

完成！重启项目后会发现会自动生成一个叫做auto-imports.d.ts的文件