前言：

? ? ? ?react項目中，每個頁面都得引入react/react-dom等元素，就像uniapp的項目中得onload,onshow等生命周期一樣，這里也可以用vite的插件：unplugin-auto-import 來解決我們每次都需要調用才能使用hook方法的問題。

安裝：

npm i unplugin-auto-import

vite.config.js中配置

這里的引入react，對應的就是界面上的單

獨引入的react/react-router-dom

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import AutoImport from 'unplugin-auto-import/vite';export default defineConfig({plugins: [react(),AutoImport({imports: ['react', // 自動引入 React 的 Hooks（如 useEffect, useState）'react-router-dom', // 自動引入 useLocation, useNavigate 等//{'react-i18next': ['initReactI18next', 'useTranslation']} //國際化使用],dts: true, // 生成類型聲明文件（支持 TypeScript）//dts: 'types/auto-imports.d.ts', //也可以直接指定目錄，會自動生成對應文件}),],
});

界面使用：之前需要這樣引入，現在不引入可以直接用

import { useEffect, useState } from "react"
import { Navigate } from "react-router-dom";