素材巴巴 > 程序开发 >

关于第三方UI库样式修改中的思考及衍生

程序开发 2023-09-03 12:52:34

无论是前端在PC上的主流框架Vue、React、Angular,还是在移动端的开发框架uniapp、React Native、Flutter等,在它们周围总是会围绕一些大大小小的第三方库,但它们的样式都是大众化的,并不是完全适用于每一个项目的。

近期在开发的一个项目中就用到了ElementUI这个第三方的库,并且基于它我们封装了一个配置式的表单组件,这两天在着手提供这个配置表单的定制样式包,在自测的过程中发现一个很麻烦的问题,也就是当我修改定制样式包的时候,配置式表单组件的样式时同步变化的,但是项目中其他地方用到的ElementUI的表单组件就自然而然的不能和配置式表单组件样式始终保持一致了。而且因为多人协同开发的原因,每个人都可能会在自己的代码中对ElementUI的表单组件样式进行一定量的修改(毕竟要保证UI的还原度),但是后期如果UI对表单组件的样式做了调整,那么无疑会增加很多的工作量,还难以确保修改的准确性和完整度。

我们都知道在日常开发中,要尽可能的提取公共组件、公共方法,那么我们也应当在项目初始开发的阶段,提供一个统一管理第三方UI库样式修改的包来进行这些样式的统一管理,这样能大大的提高项目的可维护性,这和提取公共组件、公共方法的思想是类似的。

显然,我能这样说,是因为目前的这个项目并不是这样做的,所以就很恼火啦,目前来说暂时没有一个好的方法来改变现在的局面(一个个文件过显然可以解决,但是效率过低了),能想到的办法就是暂时是提供一个样式包对页面单独书写的样式进行覆盖(但其实并不能完全解决,因为你会发现就算你全部添加了 !important 将它样式的优先级提升,但是页面中还是会有人已经写了 !important,那提供的样式包还是不能解决所有问题)。好吧,写到这儿我已经想不到任何其他的处理方式了,就只能这样来做了。

最后,希望大家都能有一个良好的代码习惯,并且在项目整体上能有一个好的规划,比如在最初的时候就对第三方库样式的修改提供一个公共的样式包~~~


标签:

素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号:备案中。