unplugin-vue-components插件会自动引入并注册src/components文件下所有的组件(不管是否使用),修改unplugin-vue-components配置项即可解决
将深度匹配关闭
再将全局组件目录往里套一层
全部代码
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// const path = require('path')
import * as path from 'path'
// element-plus按需引入 --------------------------------------------------------------------------
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers' // 配置项地址https://github.com/antfu/unplugin-vue-components#installation
// 全局组件setup中定义组件name的插件 --------------------------------------------------------------
// import DefineOptions from 'unplugin-vue-define-options/vite';
// npm install unplugin-vue-define-options -D
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
AutoImport({ // element-plus按需引入
resolvers: [ElementPlusResolver()],
}),
Components({ // 自动按需引入插件
resolvers: [
ElementPlusResolver(),// element-plus按需引入
// 自己写引入规则
// (componentName) => {
// // where `componentName` is always CapitalCase
// if (componentName.startsWith('Van'))
// return { name: componentName.slice(3), from: 'vant' }
// },
],
// 其它配置项
// relative paths to the directory to search for components.
dirs: ['src/components'],
// valid file extensions for components.
extensions: ['vue'],
// search for subdirectories 是否深度匹配引入
deep: false,
}),
// DefineOptions() // 全局组件setup中定义组件name的插件
],
resolve: {
// 配置路径别名(还需在tsconfig中配置路径)
alias: {
'@': path.resolve(__dirname, './src'),
'libs': path.resolve(__dirname, './libs'),
},
},
server: {
port: 3030,
proxy: {
"/vue3admin": { // 拦截以/vue3admin开头的请求
target: 'http://uatapi3.pinnongjt.com', // 实际要访问域名
changeOrigin: true,
rewrite: (path) => {
// 域名重写 当前的baseurl => http://172.16.3.16:3000 会被“静默”代理为 => target(http://uatapi3.pinnongjt.com)
return path.replace(/^\/vue3admin/, '')
}
},
}
}
})