element plus 按需导入vue

步骤一:

下载element plus

在打开vue项目的编辑器 中打开终端 ,或者在cmd窗口 进入到项目目录

用你的包管理器安装element plus,例如使用npm包管理器

复制代码
npm install element-plus --save

查看是否安装成功:查看项目文件package-lock.json中有没有element plus

复制代码
dependencies": {
        "axios": "^1.7.7",
        "element-plus": "^2.8.3",
        "vue": "^3.4.29",
        "vue-router": "^4.3.3"
      }

步骤二:

下载自动导入的插件

复制代码
npm install -D unplugin-vue-components unplugin-auto-import

步骤三:

在vite.config配置文件中导入

javascript 复制代码
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'

步骤四:

在vite.config配置文件中配置按需导入插件

javascript 复制代码
export default defineConfig({
  plugins: [
    vue(),
    AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    
  ]
})
相关推荐
Highcharts.js1 小时前
适合报表系统的可视化图表|Highcharts支持直接导出PNG和PDF
javascript·数据库·react.js·pdf
ZC跨境爬虫1 小时前
使用Claude Code开发校园交友平台前端UI全记录(含架构、坑点、登录逻辑及算法)
前端·ui·架构
慧一居士1 小时前
Vue项目中,何时使用布局、子组件嵌套、插槽 对应的使用场景,和完整的使用示例
前端·vue.js
叫我一声阿雷吧1 小时前
JS 入门通关手册(35):执行上下文、调用栈与作用域链深度解析
javascript·作用域链·js进阶·执行上下文·调用栈·变量提升·闭包原理
Можно1 小时前
uni.request 和 axios 的区别?前端请求库全面对比
前端·uni-app
M ? A2 小时前
解决 VuReact 中 ESLint 规则冲突的完整指南
前端·react.js·前端框架
Jave21082 小时前
实现全局自定义loading指令
前端·vue.js
奔跑的呱呱牛2 小时前
CSS Grid 布局参数详解(超细化版)+ 中文注释 Demo
前端·css·grid
木斯佳3 小时前
前端八股文面经大全:影刀AI前端一面(2026-04-01)·面经深度解析
前端·人工智能·沙箱·tool·ai面经
Amumu121383 小时前
Js:正则表达式(一)
开发语言·javascript·正则表达式