vue3+vite 使用 unplugin-auto-import 的小记

也是才刚刚学习如何使用vite,多多少少有些坑。废话不多说，走起。项目根目录下：

   npm install unplugin-auto-import  -D

然后在vite.config.ts里的plugins里加入

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import { resolve, join } from "node:path";
import AutoImport from "unplugin-auto-import/vite";

export default defineConfig({
  plugins: [
    vue(),
    AutoImport({
      imports: [
        "vue",
        "vue-router",
        "pinia"
        // 其他需要自动导入的库
      ],
    }),
  ],
  resolve: {
    alias: {
      "@": resolve(__dirname, "src"),
      "@assets": join(__dirname, "src/assets"),
    },
  },
});

到这里其实也差不多能用了,只是vscode会提示找不到类型,会爆红。那么在tsconfig.json下加入些配置，在include这个字段里加入./auto-imports.d.ts

"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue","./auto-imports.d.ts"]

然后爆红就消失了,没消失的话重启下vscode。