qiankun微應(yīng)用中樣式隔離處理方式疏旨,官方文檔有有說到處理方式很魂;
一般在主應(yīng)用中配置樣式隔離:
如何確保主應(yīng)用跟微應(yīng)用之間的樣式隔離
但很多情況往往不是很理想,例如說檐涝,主應(yīng)用支持的瀏覽器版本低遏匆,無法開啟官方的樣式隔離處理方案;
這樣就只能在微應(yīng)用(子應(yīng)用)中進(jìn)行處理樣式隔離谁榜。
想到的處理方式有兩種:
1幅聘、每個(gè)css都添加class前綴
2、微應(yīng)用打包為多應(yīng)用窃植,處理每個(gè)頁面的樣式兼容性帝蒿,將影響降低到最小。
每個(gè)css都添加class前綴
如果所有的樣式都用的是less或sass到是很好解決巷怜,網(wǎng)上能找到很多添加樣式前綴的插件葛超。如果用的是css 到比較麻煩。網(wǎng)上沒有好用的插件延塑,考慮自己寫一個(gè)loader 插件對css添加class前綴對樣式進(jìn)行隔離绣张。
document.body
有些框架的 modal彈窗組件,加了transfor 后关带,會(huì)將元素綁定到body上侥涵,導(dǎo)致樣式隔離失效。這個(gè)并沒有好的解決方案。只能是使用 spacename 隔離芜飘。