vue 범위 스타일과 부트 스트랩 사이의 충돌

Question

vuejs에 포함 된 플러그인을 개발 중입니다. dev 모드에서이 플러그인은 부트 스트랩을로드하는 lorem ipsum html 페이지에 내장되어 있습니다.

"close"클래스가있는 플러그인 내부의 요소 중 하나가 부트 스트랩 닫기 클래스의 영향을받는 것으로 나타났습니다. 나는 외부 스타일에 영향을받지 않기 위해 (고객이이 플러그인을 포함 할 것이므로) Vue.js 스타일을 완전히 스코프하고 싶지만 내 내부 범위 스타일을 플러그인 외부로 유출하지 말고 고객 페이지에 영향을 미치기를 원합니다.

예를 들어 웹팩 컴파일 중에 고유 한 ID로 클래스 이름을 재정 의하여 할 수있는 방법이 있는지 알고 싶습니다.

Answer 1

div#myId에 플러그인을 래핑 한 다음 범위가 지정된 CSS를 사용하여 div#myId 내부의 요소를 타겟팅 할 수 있습니다. 귀하의 경우에는

그렇게처럼 "가까운"태그 요소를 대상 수 :

div#myID .close{ 
    /* your styles here */ 
}