vue3 + webpack 的 element-plus的引入

东北狍子

已于 2022-01-26 15:06:05 修改

阅读量2k

点赞数 1

分类专栏： element-plus vue3.0 webpack 文章标签： webpack vue.js javascript

于 2022-01-26 11:15:03 首次发布

本文链接：https://blog.csdn.net/web5197/article/details/122697798

版权

本文介绍了如何在Vue3项目中结合Webpack全局与按需引入element-plus组件库，包括在main.js或main.ts中引入及配置vue.config.js的详细步骤。

摘要由CSDN通过智能技术生成

首先安装 element-plus

npm i element-plus -S

1.全局引入 main.js/ts

首次加载组建过多性能差不推荐

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'

createApp(App).use(ElementPlus).mount('#app')

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

东北狍子

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

vue3-webpack5-element-plus

05-24

webpack5-demo 基于webpack5搭建的Vue开发和生产环境，目的在于熟悉webpack5以及优化开发和生产环境。 webpack5新改动通过持久缓存提高构建性能使用更好的算法和默认值来改善长期缓存通过更好的Tree Shaking和代码生成来提高bundle的大小，Commonjs 的 TreeShaking,更好的 TreeShaking 可以生成 ES5 和 ES6 / ES2015 代码提高与Web平台的兼容性通过更好的树摇和代码生成来改善捆绑包大清除处于怪异状态的内部结构，同时在 v4 中实现功能而不引入任何重大更改通过引入重大更改来为将来的功能做准备，以使我们能够尽可能长时间地使用 v5 1. 预设（presets）预设(presets)的功能主要包括两个：哪些新语法会被转换，比如@babel/preset-env是指已经纳入标准(ES6-ES1

vue3 element-plus按需引入（webpack）优雅用法

qq_42164187的博客

01-12

3943

1.安装 npm install -D unplugin-vue-components unplugin-auto-import 2.配置vue.config.js 注意要放在configureWebpack里，不然会报错“plugins” is not allowed，这里官网未提示 const AutoImport = require('unplugin-auto-import/webpack') const Components = require('unplugin-vue-components/w

参与评论您还未登录，请先登录后发表或查看评论

unplugin-vue-components 安装和配置指南

热门推荐

所行皆坦途

11-26

1万+

element-ui 是配合 vue2 使用，element-plus 是配置 vue3 使用的。

基于vite+vue3+pinia+element-plus+ts后台管理系统源码+项目说明.zip

04-10

基于vite+vue3+pinia+element-plus+ts后台管理系统源码+项目说明.zip ## 简介 vue-element-perfect 是一个后台前端解决方案,它使用了最新的前端技术栈、动态路由，权限验证，并且有着丰富的组件,企业级中后台解决...

基于vite+vue3+pinia+element-plus+ts后台管理系统

04-08

【标题】"基于vite+vue3+pinia+element-plus+ts后台管理系统"是一个现代的前端开发框架，用于构建高效、可扩展的企业级后台管理界面。这个项目整合了多种前沿的技术，旨在提供一个功能全面、性能优异的解决方案，...

vue3 + vite5 + typescript + element-plus 构建的后台管理前端模板的 vue3 版本

04-02

Element-Plus 是一个基于 Vue3 的企业级 UI 组件库，它是 Element UI 的升级版，提供了丰富的界面组件，如表格、按钮、对话框等，使得开发者可以快速构建美观的后台管理系统。Element-Plus 支持 Vue3 的特性，如 ...

vue3+pinia+element-plus搭建的模板工程

01-04

无论您是一名经验丰富的开发者还是刚入门的新手，这个Pinia+Vue3+Element Plus+Webpack 5搭建的系统模板工程都将成为您的得力助手。此zip解压后即可立即运行，为了保证项目依赖一致性，我将node_modules也一起上传...

使用 webpack 从0开始搭建的 vue3+sass+element-plus+typescript 项目

09-02

在本文中，我们将深入探讨如何使用Webpack从零开始搭建一个基于Vue3、Sass、Element-Plus和TypeScript的项目。Webpack是一个强大的模块打包工具，它能够处理JavaScript、CSS和其他资源，将它们打包成优化过的单一...

Vue3使用Element-plus

IT菜鸟

02-23

3666

此处 Vue3 使用了 Vite 构建工具，没有使用 webpack。

Vue 3 项目中 Element Plus 按需引入优化打包

paper_umbrella的博客

06-26

768

通过以上步骤，我们成功地将 Element Plus 从全局引入修改为按需引入，避免不必要的库文件打包进最终的项目中，从而减小打包体积。这样可以提高项目性能并加快页面加载速度。希望本文对您有所帮助！如有任何问题或疑问，请随时联系我。祝您的项目开发顺利！🚀👩‍💻🌟。

vue3集成Element Plus

I_xuebi的博客

05-30

5868

vue3、element-plus（自动引入、自动导入、国际化、中文、图标）

vue3+element-plus搭建后台管理系统（三）

小确幸的博客

12-23

2014

vue3+element-plus 后台管理系统登录功能的实现

vue3项目下按需导入elementplus

qq_21295455的博客

05-16

vue3项目下按需导入elementplus

webpack5构建基于Vue3+ElementPlus项目搭建(开发和生产)

qq_44472790的博客

10-01

912

webpack5+vue3+elementPlus构建开发和生产环境

vue-element-plus-admin：一套基于vue3、element-plus、ts、vite的后台集成方案

chenchuang0128的博客

03-11

6288

vue-element-plus-admin：一套基于vue3、element-plus、ts、vite的后台集成方案，中后台前端解决方案的探索与实践。摘要：本文主要介绍了 vue-element-plus-admin，一个基于 element-plus 的免费开源中后台前端模版。文章首先介绍了该模版的开发背景和技术栈，然后阐述了其定位和特点，最后讨论了如何基于该模版进行二次开发。一、引言随着前端技术的不断发展，中后台前端解决方案的需求越来越强烈。为了满足这一需求，许多开源模版和框架应运而生。

vue+webpack 实现组件按需引入

李栋鹏的专栏

03-07

5903

Element官网，//官网：http://element-cn.eleme.io/#/zh-CN/component/quickstart注释 vue用webpack打包时 es6语言可能不兼容部分浏览器可以安装es2015模块1、安装依赖包1$ npm install --save-dev babel-preset-es2015ps：babel-loader、babel-core应该是默认装...