element 升级 element plus(element Plus)

今天Element Plus稳定版正式发布！
从第一次提交开始，经过1年7个月的持续迭代开发，256个贡献者提交的共2635个提交，2494个PR，137个Alpha和Beta版本，Element Plus的第一个正式版终于在社区每一个学生的参与和帮助下与大家见面了。
TypeScript和Vue 3Element Plus的主要更新是用TypeScript和Vue 3.2开发的，提供了完整的类型定义文件。并使用Composition API减少耦合，简化逻辑。
兼容性Vue 3已经不兼容IE了，所以Element Plus也改进了最低兼容版本。
边缘 79
Firefox 78
铬 64
Safari 12
如果想在较低版本的浏览器上正常使用Element Plus，请自行使用Babel、ESBuild或其他转换工具，并介绍相应的polyfill。值得注意的是，Element Plus使用的是ResizeObserver，如果有兼容性需求，需要引入resize-observer-polyfill。详见ResizeObserver兼容性。
ESM CJSElement Plus同时支持ESM、CJS和UMD格式。一般不需要关注导入的格式，构建工具会自动匹配并转换成目标格式。同时不需要额外配置，支持按需加载的能力。
设计组件尺寸系统从默认/中/小/迷你更改为更自然的大/默认/小。根据默认设置，如果需要放大，请选择大；如果需要缩小，请选择小。
Padding优化为更通用的4px系统，以4/8 px为原子单位控制整个系统的padding一致性。也就是说，大组件填充也大，小组件填充也小。详情请参考尺寸修改说明。
图标为了使用Element Plus的内置图标，用户往往需要参考一个~75KB的字体文件，以及一个额外的网络请求。在大多数情况下，这完全是不必要的开销，对于在意首页的体量和加载速度的用户来说，这是一个长期的痛点。
所以我们把所有的字体图标都改成了Inline Vue SVG组件，也就是说所有的组件都和你的打包代码放在同一个请求里，这样就不会有额外的网络请求来请求字体文件，也不会有因为网络请求失败而无法渲染的小方块，图标的清晰度也会更好。您可以下载旧版本的字体文件，以保持旧项目的兼容性。
un pkg . com/Element-plus @ 1 . 1 . 0-beta . 24/theme-chalk/base . cssunpkg . com/browse/Element-Plus @ 1 . 1 . 0-beta . 24/theme-chalk/Fonts配置元素Plus增加了一个全局配置管理的新组件config-provider，用来替换Element UI的全局配置Vue.prototype.$ELEMENT。您可以通过以下两种方式执行全局配置。
//模式一：main . t import { create app } from ‘ vue ‘ import element plus from ‘ element-plus ‘ import app from ‘。/app.vue’ createapp (app)。使用(element plus，{size :’ small’})。mount(‘ # app ‘)//Mode 2 app . vue button关于API变更的更多细节，请参考《元素加不兼容变更与升级指南》。
新组件和设计资源在迁移现有组件的基础上，正式版中增加了空格、骨架、空、缀四个新组件，丰富开发者的选择。增加了使用虚拟滚动选择V2组件优化长列表显示性能的问题。
同时，我们还制作并上传了最新的Figma设计资源文件，其中包含了所有的组件信息，方便产品经理和设计师使用。
2版的正式发布意味着整体迁移和适配工作的结束，API设计基本稳定，但这仅仅是开始。在后续的迭代中，我们将专注于优化交互细节和添加额外的功能，包括但不限于以下内容：
在黑暗主题正式版中，我们集成了CSS变量的新能力，会比之前的SASS变量配置模式更方便，性能更好。在这个能力的基础上，我们正在紧锣密鼓的开发黑暗题材，后续版本会很快和大家见面。
当高性能表组件在测试版中发布时，我们提到了为表提供虚拟化功能，以优化表组件在大数据量情况下的性能。不过这次正式发布暂时还不包括这部分功能，但会在后续迭代中加入。这个功能之所以没有实现，很大一部分原因是我们一直在探索哪种方式更适合用户。要么我们直接加入虚拟化的表格渲染引擎，要么我们提供一个渲染接口让用户添加虚拟化的组件(比如vue-virtual-scroller)自行渲染。后续我们会参考现在市面上相关组件的实现，提供一套解决方案，让Element Plus的表格组件更容易使用。
相关生态元素加图标的集合。加游乐场——可以点这里试试！PlusVite快速入门模板。按需拔出元素加元素加加载样式插件。设计素材-元素加社区的Logo、表情等资源。awesome-element-plus-element plus相关库、模板和资源列表。