Bootstrap 오류 - CDN 링크 사용

Bootstrap을 사용하는 두 가지 방법

1. 파일을 전부 다 다운로드 받아 작업 환경 세팅

2. CDN으로 링크 걸어 사용

 

1번 방식으로 작업하였을 때, 올바른 코드를 작성했음에도 불구하고 일부 기능이 적용되지 않는 경우 다음과 같이 해결

<script src="js/jquery-3.6.0.min.js"></script>
<script src="js/bootstrap.min.js"></script>

<!-- 위 두 코드 사이에 아래 코드 삽입 -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

 

 

CDN 사용 시, 다운로드하여 따로 환경을 세팅해주지 않아도 된다는 점에서 간편하다고 할 수도 있음.

그러나 CDN에 문제가 생길 시 내가 작업한 사이트에도 영향 미친다는 단점 존재 + 서버의 속도 느려질 수 있음

 

​