element-plus [Build] Bundle size is heavy even components are importing explicitly

y53ybaqx 于 5个月前发布在其他

关注(0)|答案(6)|浏览(49)

Bug Type: Build

Environment

Vue Version: 3.2.31
Element Plus Version: 2.0.2
Browser / OS: Any
Build Tool: Vite

Reproduction

N/A

Reproduction Link

Github Repo

Steps to reproduce

To create a simple vue 3 + vite + element plus

npm create vite@latest my-vue-app --template vue

then install element-plus

npm install element-plus@2.0.2

once setup the project. I am explicitly importing each element plus component like

import { ElButton } from 'element-plus/lib/components/button/index';

With this single "ElButton" component import, my bundle size is like 160kb.

But after some research I find that if I change importing the components from '/lib/' folder I change it to '/es/' folder then the bundle size is reduced to 33kb.

Why this is happening ?

What is Expected?

bundle should import only the imported component from element plus.

What is actually happening?

Importing element-plus component explicitly from inside the /lib/ folder is very heavy and importing all code which is not required.

Additional comments

Need some explanation for this behavior of these imports and which is the better way to import the element-plus components.

element-plus

来源：https://github.com/element-plus/element-plus/issues/11735

6条答案

按热度按时间

qyyhg6bp1#

https://element-plus.org/en-US/guide/quickstart.html#manually-import

Is this the solution you want?

赞(0）回复(0）举报 4个月前

w8f9ii692#

@ryuhangyeong kind of but can you tell me which is preferable way to import, will this "manually-import" reduce the bundle size as same as the "auto import" ?
I need to reduce the bundle size as much as possible, so which one is good ?

赞(0）回复(0）举报 4个月前

xqnpmsa83#

@ryuhangyeong and others ! Does this auto import works with vite SSR ?

赞(0）回复(0）举报 4个月前

lp0sw83n4#

https://element-plus.org/en-US/guide/quickstart.html#on-demand-import

Recommend

https://github.com/antfu/unplugin-vue-components

赞(0）回复(0）举报 4个月前

ymzxtsji5#

@ryuhangyeong thanks, for the link, one more doubt. I am facing issue with vite SSR with auto import. Will this plugin works on SSR ?

赞(0）回复(0）举报 4个月前