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()],
    }),
    
  ]
})
相关推荐
streaker3031 分钟前
多 IDE/Agent 环境下的 Skill 管理方案
前端·javascript·ai编程
Mintopia2 分钟前
密集信息展示:表格与布局的取舍与实践指南
前端
牛奶6 分钟前
从一行字到改变世界:HTTP这三十年都经历了什么?
前端·http·http3
进击的尘埃8 分钟前
Playwright Component Testing 深度拆解:组件挂载到底干了啥,视觉快照又怎么塞进 CI
javascript
OpenTiny社区33 分钟前
以界面重构文字,GenUI 正式发布!
前端·vue.js·ai编程
yuki_uix41 分钟前
深入理解 JavaScript 的 this:从困惑到掌握的完整指南
前端·javascript
小贤哥41 分钟前
死磕这几道js手写题
前端·程序员
Lee川43 分钟前
🌐 深入 Chrome 浏览器:从单线程到多进程架构的进化之路
前端·架构·前端框架
学以智用1 小时前
Vue 3 项目核心配置文件详解
前端·vue.js
工边页字1 小时前
AI 开发必懂:Context Window(上下文窗口)到底是什么?
前端·人工智能·后端