我們這邊的前端做了個(gè)單頁(yè)面應(yīng)用,用vue+webpack做的,然后現(xiàn)在出個(gè)一個(gè)問題:
就是每個(gè)頁(yè)面多帶帶引了自己的CSS,然后我現(xiàn)在就從A面到B頁(yè)面之后,再Chrome的F12中還能看到A頁(yè)面的CSS還殘留著,返回A頁(yè)面后,B的CSS也在,相當(dāng)于跳的頁(yè)面越多CSS疊加的越多,因?yàn)榍捌跊]注意,所以中間有一些class名字沖突了,導(dǎo)致樣式?jīng)_突出問題了,不知道各位有沒有遇到過(guò)這個(gè)問題,想問能不能每個(gè)頁(yè)面只加載自己引用CSS的,跳轉(zhuǎn)后讓前一個(gè)頁(yè)面的銷毀?
像這樣
相互不影響
所以,最好是做好的CSS設(shè)計(jì),參考一些CSS組織方式:BEM SMACSS
你可以把公用的樣式多帶帶寫一個(gè)文件在main.js引進(jìn)來(lái),是每個(gè)頁(yè)面都要用到的。然后在組件內(nèi)就用scoped。我也發(fā)現(xiàn)這個(gè)問題了,正在探索。
Scoped是一種方式,但是并不能解決所有問題,比如v-html中的就不在scope中,<slot>的支持也只有2.0的loader才支持。而且scoped方式是Vue特有,如果你使用其他框架,就得另尋方式了。
與加載順序無(wú)關(guān)