QianKun 解決element ui 和 element-plus 樣式衝突

Gherardo發表於2024-06-27

如果你使用qiankun 改在完應用存在 主應用vue2+element-ui. 子應用vue3+element-plus 存在element 樣式衝突

由於element-ui 和 element-plus 字首相同、命名規則相同,但內部部分樣式實現方式不同,從而導致樣式被汙染,頁面樣式混亂。

1:自定義名稱空間

element-plus預設名稱空間為el,el會作為其編譯後的class名及css字首。支援自定義命名

1: app.vue 新增

2:建立 styles/element/index.scss

3: 在vite.config.js 中配置

webpack的話。配置vue.config.js

4:在main.js 中替換成自己修改過字首的配置

主子應用就顯示正常

相關文章