v5로 마이그레이션
v4에서 v5로 마이그레이션하는 데 도움이 되도록 부트스트랩 소스 파일, 문서 및 구성 요소에 대한 변경 사항을 추적하고 검토합니다.
종속성
- jQuery를 삭제했습니다.
- Popper v1.x에서 Popper v2.x로 업그레이드되었습니다.
- Libsass가 제공된 Sass 컴파일러가 더 이상 사용되지 않으므로 Libsass를 Dart Sass로 대체했습니다.
- 문서 구축을 위해 Jekyll에서 Hugo로 마이그레이션
브라우저 지원
- 중단된 Internet Explorer 10 및 11
- 삭제된 Microsoft Edge < 16(레거시 Edge)
- 파이어폭스가 60 미만으로 떨어졌습니다.
- 떨어진 사파리 < 12
- iOS Safari < 12 삭제
- Chrome이 60 미만으로 떨어졌습니다.
문서 변경 사항
- 새롭게 디자인된 홈페이지, 문서 레이아웃 및 바닥글.
- 새로운 소포 가이드 를 추가 했습니다.
- v4의 테마 페이지 를 Sass, 전역 구성 옵션, 색 구성표, CSS 변수 등에 대한 새로운 세부 정보로 대체 하는 새로운 사용자 정의 섹션 을 추가 했습니다.
- 모든 양식 문서를 새로운 양식 섹션 으로 재구성 하여 콘텐츠를 보다 집중된 페이지로 나눴습니다.
- 마찬가지로 레이아웃 섹션 을 업데이트하여 그리드 콘텐츠를 보다 명확하게 표현했습니다.
- "Navs" 구성 요소 페이지의 이름이 "Navs & Tabs"로 변경되었습니다.
- "수표" 페이지의 이름을 "수표 및 라디오"로 변경했습니다.
- 탐색 모음을 재설계하고 새 하위 탐색을 추가하여 사이트 및 문서 버전을 더 쉽게 탐색할 수 있습니다.
- 검색 필드에 대한 새로운 키보드 단축키 추가: Ctrl + /.
사스
-
중복 값을 더 쉽게 제거할 수 있도록 기본 Sass 맵 병합을 버렸습니다. 이제 와 같은 Sass 맵에서 모든 값을 정의해야 합니다
$theme-colors. Sass 지도 를 다루는 방법을 확인하십시오 . -
파괴더 이상 YIQ 색상 공간과 관련이 없기 때문에
color-yiq()함수 및 관련 변수 의 이름 이 변경되었습니다. #30168을 참조하십시오.color-contrast()$yiq-contrasted-threshold로 이름이 변경됩니다$min-contrast-ratio.$yiq-text-dark및$yiq-text-light이름이 각각 및 로 변경$color-contrast-dark됩니다$color-contrast-light.
-
파괴보다 논리적인 접근을 위해 미디어 쿼리 믹스인 매개변수가 변경되었습니다.
media-breakpoint-down()다음 중단점 대신 중단점 자체를 사용합니다(예: 보다 작은 대상 뷰포트media-breakpoint-down(lg)대신 ).media-breakpoint-down(md)lg- 마찬가지로 의 두 번째 매개변수
media-breakpoint-between()도 다음 중단점 대신 중단점 자체를 사용합니다(예: 및 사이의 대상 뷰포트media-between(sm, lg)대신 ).media-breakpoint-between(sm, md)smlg
-
파괴인쇄 스타일 및
$enable-print-styles변수를 제거했습니다. 인쇄 디스플레이 클래스는 여전히 주변에 있습니다. #28339를 참조하십시오 . -
파괴
color()변수 대신 ,theme-color()및gray()함수를 삭제 했습니다. #29083을 참조하십시오 . -
파괴이름이 변경된
theme-color-level()기능은color-level()이제 색상 대신 원하는 색상을 허용합니다$theme-color. 참고 #29083 조심해:color-level()나중에 에 떨어졌습니다v5.0.0-alpha3. -
파괴간결함을 위해
$enable-prefers-reduced-motion-media-query및$enable-pointer-cursor-for-buttonsto$enable-reduced-motion및 이름 이 변경되었습니다.$enable-button-pointers -
파괴
bg-gradient-variant()믹스 인을 제거했습니다 . 클래스를 사용.bg-gradient하여 생성된 클래스 대신 요소에 그라디언트를 추가합니다.bg-gradient-*. -
파괴 이전에 사용되지 않는 믹스인 제거:
hover,hover-focus,plain-hover-focus및hover-focus-activefloat()form-control-mixin()nav-divider()retina-img()text-hide()(또한 관련 유틸리티 클래스를 삭제했습니다..text-hide)visibility()form-control-focus()
-
파괴Sass의 자체 색상 스케일링 기능과의 충돌을 피하기 위해
scale-color()기능 이름 이 변경되었습니다.shift-color() -
box-shadow믹스인은 이제 여러 인수에서null값과 드롭 을 허용합니다. #30394를 참조하십시오 .none -
이제
border-radius()mixin에 기본값이 있습니다.
컬러 시스템
-
새로운 색상 시스템을 위해 작업
color-level()하고$theme-color-interval제거된 색상 시스템. 코드베이스의 모든 기능lighten()과 기능은 및darken()로 대체됩니다 . 이 기능은 밝기를 일정하게 변경하는 대신 색상을 흰색 또는 검정색과 혼합합니다. 가중치 매개변수가 양수인지 음수인지에 따라 색상을 색조 또는 음영 처리합니다 . 자세한 내용은 #30622 를 참조하세요.tint-color()shade-color()shift-color() -
모든 색상에 대해 새로운 색조와 음영을 추가하여 새로운 Sass 변수로 각 기본 색상에 대해 9개의 개별 색상을 제공합니다.
-
향상된 색상 대비. 색상 대비 비율을 3:1에서 4.5:1로 높이고 WCAG 2.1 AA 대비를 보장하기 위해 파란색, 녹색, 청록색 및 분홍색 색상을 업데이트했습니다. 또한 색상 대비 색상을 에서 로 변경
$gray-900했습니다$black. -
색상 시스템을 지원하기 위해 색상을 적절하게 혼합하는 새로운 사용자 정의
tint-color()및 기능을 추가했습니다.shade-color()
그리드 업데이트
-
새로운 중단점! 이상에 대한 새로운
xxl중단점을 추가1400px했습니다. 다른 모든 중단점에는 변경 사항이 없습니다. -
개선된 거터. 거터는 이제 rems로 설정되며 v4(
1.5rem또는 약24px, 에서 아래로30px)보다 좁습니다. 이것은 그리드 시스템의 거터를 간격 유틸리티와 정렬합니다.- 수평/수직 거터, 수평 거터 및 수직 거터를 제어하는 새 거터 클래스 (
.g-*,.gx-*, 및 )를 추가했습니다..gy-* - 파괴새 거터 유틸리티와 일치하도록 이름
.no-gutters이 변경되었습니다..g-0
- 수평/수직 거터, 수평 거터 및 수직 거터를 제어하는 새 거터 클래스 (
-
열이 더 이상 적용되지 않았으므로 해당 동작을 복원하려면 일부 요소를
position: relative추가해야 할 수 있습니다 ..position-relative -
파괴
.order-*자주 사용하지 않는 여러 클래스를 삭제했습니다 . 우리는 이제 상자에서 꺼내기.order-1만 하면 됩니다..order-5 -
파괴
.media유틸리티로 쉽게 복제할 수 있는 구성 요소를 삭제했습니다 . 예제는 #28265 및 플렉스 유틸리티 페이지를 참조하십시오 . -
파괴
bootstrap-grid.css이제box-sizing: border-box전역 상자 크기를 재설정하는 대신 열에만 적용됩니다. 이렇게 하면 간섭 없이 더 많은 곳에서 그리드 스타일을 사용할 수 있습니다. -
$enable-grid-classes더 이상 컨테이너 클래스 생성을 비활성화하지 않습니다. #29146을 참조하십시오. -
make-col지정된 크기가 없는 동일한 열로 기본적으로 믹스인을 업데이트했습니다 .
콘텐츠, 재부팅 등
-
RFS 는 이제 기본적으로 활성화됩니다. 믹스인을 사용하는 제목은 뷰포트에
font-size()맞게 자동으로 조정됩니다이 기능은 이전에 v4에서 옵트인되었습니다.font-size -
파괴
$display-*변수와$display-font-sizesSass 맵 을 대체하기 위해 디스플레이 타이포그래피를 정밀 검사 했습니다.$display-*-weight또한 단일$display-font-weight및 조정된font-sizes 에 대한 개별 변수를 제거했습니다 . -
두 개의 새로운
.display-*제목 크기.display-5및 가 추가되었습니다.display-6. -
링크가 특정 구성 요소의 일부가 아닌 경우 기본적으로(마우스를 가리킬 때뿐만 아니라) 밑줄이 그어집니다 .
-
스타일을 새로 고치고 스타일을 더 잘 제어할 수 있도록 CSS 변수를 사용하여 테이블을 재설계 했습니다.
-
파괴중첩 테이블은 더 이상 스타일을 상속하지 않습니다.
-
파괴
.thead-light모든 테이블 요소( , , , 및 ) 에 사용할 수 있는 변형 클래스를.thead-dark위해 삭제됩니다 ..table-*theadtbodytfoottrthtd -
파괴
table-row-variant()mixin은 (색상 이름) 및 (색상 코드) 의table-variant()2개 매개변수만 허용하고 이름 이 변경되었습니다. 테두리 색상과 강조 색상은 테이블 요인 변수를 기반으로 자동으로 계산됩니다.$color$value -
-y테이블 셀 패딩 변수를 및 로 분할합니다-x. -
파괴
.pre-scrollable수업을 중단 했습니다. #29135 참조 -
파괴
.text-*유틸리티는 더 이상 링크에 호버 및 포커스 상태를 추가하지 않습니다..link-*대신 도우미 클래스를 사용할 수 있습니다. #29267 참조 -
파괴
.text-justify수업을 중단 했습니다. #29793 참조 -
padding-left기본 가로 켜기<ul>및<ol>브라우저의 요소를 기본값으로 재설정40px합니다2rem. -
미디어 쿼리 를 통해 모션 감소를 요청하는 사용자를 제외하고 전 세계적으로
$enable-smooth-scroll적용되는 가 추가되었습니다 . #31877 참조scroll-behavior: smoothprefers-reduced-motion
RTL
- 수평 방향 특정 변수, 유틸리티 및 믹스인은 모두 flexbox 레이아웃에서 볼 수 있는 것과 같은 논리적 속성을 사용하도록 이름이 변경되었습니다(예 :
start및end대신 .leftright
양식
-
새로운 플로팅 폼이 추가되었습니다! 부동 레이블 예제를 완전히 지원되는 양식 구성 요소로 승격했습니다. 새로운 플로팅 라벨 페이지를 참조하세요.
-
파괴 통합된 기본 및 사용자 정의 양식 요소. v4에서 기본 및 사용자 정의 클래스가 있었던 확인란, 라디오, 선택 및 기타 입력이 통합되었습니다. 이제 거의 모든 양식 요소가 완전히 사용자 정의되며 대부분은 사용자 정의 HTML이 필요하지 않습니다.
.custom-check지금.form-check입니다..custom-check.custom-switch지금.form-check.form-switch입니다..custom-select지금.form-select입니다..custom-file의.form-file상단에 사용자 정의 스타일로 대체되었습니다.form-control..custom-range지금.form-range입니다.- 네이티브
.form-control-file및.form-control-range.
-
파괴떨어
.input-group-append졌고.input-group-prepend. 이제 버튼을.input-group-text입력 그룹의 직계 자식으로 추가할 수 있습니다. -
유효성 검사 피드백 버그가 있는 입력 그룹 의 오랜 경계 반경 누락은 유효성 검사
.has-validation를 통해 입력 그룹에 추가 클래스를 추가하여 마침내 수정되었습니다 . -
파괴 그리드 시스템에 대한 양식별 레이아웃 클래스를 삭제했습니다.
.form-group,.form-row또는 대신 그리드 및 유틸리티를 사용하십시오.form-inline. -
파괴이제 양식 레이블에 가 필요합니다
.form-label. -
파괴
.form-text더 이상 설정하지 않으므로displayHTML 요소를 변경하는 것만으로 원하는 대로 도움말 텍스트를 인라인하거나 차단할 수 있습니다. -
<select>유효성 검사 아이콘이 s에 더 이상 적용되지 않습니다multiple. -
scss/forms/입력 그룹 스타일을 포함하여 아래에 소스 Sass 파일을 재배열 했습니다.
구성품
padding경고, 이동 경로, 카드, 드롭다운, 목록 그룹, 모달, 팝오버 및 도구 설명에 대한 통합 값이$spacer변수를 기반으로 합니다. #30564를 참조하십시오 .
아코디언
- 새로운 아코디언 구성 요소가 추가되었습니다 .
경고
-
이제 경고 에 아이콘이 있는 예가 있습니다 .
-
<hr>이미 을(를) 사용하고 있기 때문에 각 경고에서 s에 대한 사용자 정의 스타일을 제거currentColor했습니다.
배지
-
파괴배경 유틸리티에 대한 모든
.badge-*색상 클래스를 삭제했습니다(예:.bg-primary대신 사용.badge-primary). -
파괴삭제
.badge-pill— 대신.rounded-pill유틸리티를 사용합니다. -
파괴
<a>및<button>요소 에 대한 마우스 오버 및 포커스 스타일을 제거 했습니다. -
배지에 대한 기본 패딩이 /에서 /
.25em로.5em증가 했습니다..35em.65em
빵 부스러기
-
padding,background-color및 를 제거하여 이동 경로의 기본 모양을 단순화했습니다border-radius. -
--bs-breadcrumb-dividerCSS 를 다시 컴파일할 필요 없이 쉽게 사용자 정의할 수 있도록 새로운 CSS 사용자 정의 속성을 추가 했습니다.
버튼
-
파괴 확인란 또는 라디오가 있는 토글 버튼 에는 더 이상 JavaScript가 필요하지 않으며 새로운 마크업이 있습니다. 더 이상 래핑 요소가 필요하지 않으며 에를추가
.btn-check하고. #30650을 참조하십시오 . 이에 대한 문서가 버튼 페이지에서 새 양식 섹션으로 이동되었습니다.<input>.btn<label> -
파괴
.btn-block유틸리티를 위해 삭제 되었습니다..btn-block를 사용 하는 대신 버튼을 및 유틸리티로.btn감싸서 필요에 따라 간격을 두십시오 . 반응형 클래스로 전환하여 더 잘 제어할 수 있습니다. 몇 가지 예를 보려면 문서를 읽으십시오..d-grid.gap-* -
추가 매개변수를 지원하도록 믹스인을
button-variant()업데이트 했습니다 .button-outline-variant() -
호버 및 활성 상태에서 대비를 높이기 위해 버튼을 업데이트했습니다.
-
비활성화된 버튼은 이제
pointer-events: none;.
카드
-
파괴
.card-deck우리 그리드를 위해 떨어 졌습니다. 열 클래스로 카드를 래핑하고 상위.row-cols-*컨테이너를 추가하여 카드 데크를 다시 생성합니다(그러나 반응형 정렬을 더 많이 제어할 수 있음). -
파괴
.card-columnsMasonry에게 유리하게 떨어 졌습니다. #28922를 참조하십시오 . -
파괴
.card기반 아코디언을 새로운 Accordion 구성 요소 로 교체했습니다 .
회전 목마
-
어두운 텍스트, 컨트롤 및 표시기에 대한 새로운
.carousel-dark변형 이 추가되었습니다(밝은 배경에 적합). -
Carousel 컨트롤의 갈매기 모양 아이콘을 Bootstrap Icons 의 새 SVG로 교체 했습니다.
닫기 버튼
-
파괴덜 일반적인 이름을 위해 로 이름
.close이 변경되었습니다..btn-close -
닫기 버튼은 이제 HTML
background-image대신 (포함된 SVG)를 사용×하므로 마크업을 건드릴 필요 없이 더 쉽게 사용자 정의할 수 있습니다. -
더 어두운 배경에서 고대비 해제 아이콘을 활성화 하는 데 사용하는 새로운
.btn-close-white변형이 추가되었습니다.filter: invert(1)
무너지다
- 아코디언에 대한 스크롤 고정이 제거되었습니다.
드롭다운
-
.dropdown-menu-dark주문형 다크 드롭다운에 대한 새로운 변형 및 관련 변수를 추가 했습니다. -
에 대한 새 변수를 추가했습니다
$dropdown-padding-x. -
대비 개선을 위해 드롭다운 구분선을 어둡게 했습니다.
-
파괴드롭다운에 대한 모든 이벤트는 이제 드롭다운 토글 버튼에서 트리거된 다음 상위 요소로 버블링됩니다.
-
data-bs-popper="static"이제 드롭다운 의 위치가 정적이고 드롭다운이 탐색 모음에 있을 때 드롭다운 메뉴에 속성이 설정됩니다data-bs-popper="none". 이것은 JavaScript에 의해 추가되었으며 Popper의 위치 지정을 방해하지 않고 사용자 정의 위치 스타일을 사용하는 데 도움이 됩니다. -
파괴
flip기본 Popper 구성을 위해 드롭다운 플러그인 옵션을 삭제 했습니다. 이제 flip modifier 의fallbackPlacements옵션에 빈 배열을 전달하여 뒤집기 동작을 비활성화할 수 있습니다 . -
자동 닫기 동작
autoClose을 처리하는 새로운 옵션으로 드롭다운 메뉴를 클릭할 수 있습니다 . 이 옵션을 사용하여 드롭다운 메뉴 내부 또는 외부의 클릭을 허용하여 대화형으로 만들 수 있습니다. -
드롭다운은 이제
.dropdown-items로 래핑된<li>s를 지원합니다.
점보트론
- 파괴유틸리티로 복제할 수 있으므로 점보트론 구성 요소를 삭제했습니다. 데모는 새로운 Jumbotron 예제를 참조하십시오.
목록 그룹
- 목록 그룹에 새
.list-group-numbered수정자를 추가했습니다.
탐색 및 탭
- , , 및 에 대한 새
null변수를 클래스에 추가했습니다.font-sizefont-weightcolor:hovercolor.nav-link
내비바
- 파괴Navbar는 이제 내부에 컨테이너가 필요합니다(필요한 간격 요구 사항 및 CSS를 대폭 단순화하기 위해).
오프캔버스
- 새로운 offcanvas 구성 요소 를 추가했습니다 .
쪽수 매기기
-
페이지 매김 링크는 이제
margin-left서로 분리될 때 모든 모서리에서 동적으로 둥근 사용자 정의가 가능합니다. -
transition페이지 매김 링크에 s를 추가 했습니다.
팝오버
-
파괴기본 팝오버 템플릿에서 로 이름
.arrow이 변경되었습니다..popover-arrow -
whiteList옵션 이름 이 으로 변경되었습니다allowList.
스피너
-
스피너는 이제
prefers-reduced-motion: reduce애니메이션을 느리게 하여 명예를 얻습니다. #31882를 참조하십시오 . -
스피너 수직 정렬이 향상되었습니다.
토스트
-
토스트는 이제 위치 지정 유틸리티
.toast-container의 도움으로 에서 위치를 지정할 수 있습니다 . -
기본 토스트 지속 시간을 5초로 변경했습니다.
-
토스트에서 제거
overflow: hidden되고 기능이 있는 적절한border-radiuss 로 대체되었습니다calc().
툴팁
-
파괴기본 툴팁 템플릿에서 로 이름
.arrow이 변경되었습니다..tooltip-arrow -
파괴의 기본값 은 팝퍼 요소의 더 나은 배치를 위해
fallbackPlacements로 변경됩니다 .['top', 'right', 'bottom', 'left'] -
파괴
whiteList옵션 이름 이 으로 변경되었습니다allowList.
유용
-
파괴RTL 지원을 추가하여 방향 이름 대신 논리적 속성 이름을 사용하도록 여러 유틸리티의 이름을 변경했습니다.
.left-*및.right-*로 이름.start-*이 변경되었습니다.end-*..float-left및.float-right로 이름.float-start이 변경되었습니다.float-end..border-left및.border-right로 이름.border-start이 변경되었습니다.border-end..rounded-left및.rounded-right로 이름.rounded-start이 변경되었습니다.rounded-end..ml-*및.mr-*로 이름.ms-*이 변경되었습니다.me-*..pl-*및.pr-*로 이름.ps-*이 변경되었습니다.pe-*..text-left및.text-right로 이름.text-start이 변경되었습니다.text-end.
-
파괴기본적으로 음수 여백을 비활성화했습니다.
-
의 배경을 추가 요소
.bg-body로 빠르게 설정하기 위한 새 클래스를 추가했습니다.<body> -
, , 및 에 대한 새 위치 유틸리티 가 추가되었습니다 . 값에는 각 속성에 대한 , 및 가 포함됩니다.
toprightbottomleft050%100% -
수평 또는 수직 중심의 절대/고정 위치 요소에 새로운
.translate-middle-x및 유틸리티를 추가했습니다..translate-middle-y -
새로운
border-width유틸리티가 추가되었습니다 . -
파괴로 이름 이 변경
.text-monospace되었습니다.font-monospace. -
파괴
.text-hide더 이상 사용해서는 안 되는 텍스트를 숨기는 구식 방법이므로 제거 했습니다. -
.fs-*유틸리티용 유틸리티가 추가되었습니다font-size(RFS 활성화됨). 이들은 HTML의 기본 제목(1-6, 큰 것에서 작은 것)과 동일한 축척을 사용하며 Sass 맵을 통해 수정할 수 있습니다. -
파괴간결함과 일관성
.font-weight-*을 위해 유틸리티 이름 이 변경되었습니다..fw-* -
파괴간결함과 일관성
.font-style-*을 위해 유틸리티 이름 이 변경되었습니다..fst-* -
CSS 그리드 및 플렉스박스 레이아웃을 위한
.d-grid디스플레이 유틸리티 및 새로운gap유틸리티( )에 추가되었습니다 ..gap -
파괴및 를 제거
.rounded-sm하고rounded-lg에 새로운 등급의 클래스를 도입.rounded-0했습니다.rounded-3. #31687을 참조하십시오 . -
새로운
line-height유틸리티 추가 :.lh-1,.lh-sm및 . 여기를 참조 하십시오 ..lh-base.lh-lg -
CSS에서 유틸리티를 이동하여
.d-none다른 디스플레이 유틸리티보다 더 많은 가중치를 부여했습니다. -
.visually-hidden-focusable를 사용하여 컨테이너에서도 작동하도록 도우미를 확장했습니다:focus-within.
도우미
-
파괴 반응형 내장 도우미는 유용한 CSS 변수뿐만 아니라 새로운 클래스 이름과 향상된 동작 이 포함된 비율 도우미 로 이름이 변경되었습니다.
- 종횡비 로 변경
by되도록 클래스 이름이 변경되었습니다 .x예를 들어.ratio-16by9지금은.ratio-16x9입니다. .embed-responsive-item더 간단한 선택자를 위해 및 요소 그룹 선택자를 삭제했습니다.ratio > *. 더 이상 클래스가 필요하지 않으며 비율 도우미는 이제 모든 HTML 요소에서 작동합니다.$embed-responsive-aspect-ratiosSass 맵 의 이름이 로 바뀌었고$aspect-ratios클래스 이름과 백분율을key: value쌍으로 포함하도록 값이 단순화되었습니다.- 이제 CSS 변수가 생성되어 Sass 맵의 각 값에 포함됩니다. 사용자 정의 종횡비 를 생성 하려면 의
--bs-aspect-ratio변수를 수정하십시오 ..ratio
- 종횡비 로 변경
-
파괴 "화면 판독기" 클래스는 이제 "시각적으로 숨겨진" 클래스 입니다.
- Sass 파일을
scss/helpers/_screenreaders.scss로 변경했습니다.scss/helpers/_visually-hidden.scss - 이름 이
.sr-onlyand.sr-only-focusableto.visually-hidden및.visually-hidden-focusable - 및 로 이름 이 변경
sr-only()되고sr-only-focusable()믹스인됩니다 .visually-hidden()visually-hidden-focusable()
- Sass 파일을
-
bootstrap-utilities.css이제 도우미도 포함됩니다. 도우미는 더 이상 사용자 정의 빌드에서 가져올 필요가 없습니다.
자바스크립트
-
jQuery 종속성 을 삭제하고 플러그인을 일반 JavaScript로 다시 작성했습니다.
-
파괴이제 모든 JavaScript 플러그인의 데이터 속성에 네임스페이스가 지정되어 부트스트랩 기능을 타사 및 자체 코드와 구별할 수 있습니다. 예를 들어,
data-bs-toggle대신 를 사용합니다data-toggle. -
모든 플러그인은 이제 CSS 선택기를 첫 번째 인수로 받아들일 수 있습니다. DOM 요소나 유효한 CSS 선택기를 전달하여 플러그인의 새 인스턴스를 만들 수 있습니다.
var modal = new bootstrap.Modal('#myModal') var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]') -
popperConfig부트스트랩의 기본 Popper 구성을 인수로 받아들이는 함수로 전달할 수 있으므로 이 기본 구성을 원하는 대로 병합할 수 있습니다. 드롭다운, 팝오버 및 도구 설명에 적용됩니다. -
Popper 요소의 더 나은 배치 를 위해 의 기본값
fallbackPlacements이 로 변경됩니다 . 드롭다운, 팝오버 및 도구 설명에 적용됩니다.['top', 'right', 'bottom', 'left'] -
_getInstance()→ 와 같은 공개 정적 메서드에서 밑줄을 제거getInstance()했습니다.