Skip to content

Attention: 关于组件样式的问题 #14

Description

@lianghx-319

受影响版本

@femessage/element-ui: ~2.12.1
对应官方 element-ui: 2.12.0

原因

  • 由于升级失误,导致本仓库的 npm 包比 element 官方的 npm 包,领先了几个 commit。

暂时发现的问题

  1. 如果基于官方 element-ui 2.12.0 生成的主题,配合 @femessage/element-ui 使用时,有部分组件的样式会不匹配。

  2. 官方 element 也存在的问题,如果使用按需引入组件样式的方式使用组件库,部分组件的样式之间会互相覆盖

样式出现问题的组件

  • Drawer (问题1)
  • Cascader (问题2)

解决方案

问题1

请根据本仓库的 master 分支生成自定义主题,即可解决。等到 element 更新版本后再同步一次,就可以无缝官方的主题了。不过由于本仓库新增了部分组件,所以推荐使用本仓库作为基准生成主题

问题2

因为按需引入和代码分割的共同作用,部分相同权重的组件样式,会随着路由的切换不断被新增的样式覆盖,导致样式污染的情况发生。

被动解决:等待官方 element 的更新

主动解决:可以使用 cdn 全量引入组件样式,对于长期使用不断迭代的项目,长远角度来说,cdn 缓存机制节省的流量比打包在项目中更多。

cdn 链接:https://cdn.jsdelivr.net/npm/@femessage/element-ui@2.12.2/lib/theme-chalk/index.css

gzip:37.5k

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions