시맨틱 UI 호환성을 위해 jQuery를 ES6 구문으로 가져오기 질문: 앱 빌드 스타일링을 위해 Babel transpiler 및 semantic-ui와 함께 ES6 구문을 활용하려면 jQuery를 가져오는 것이 필요합니다. 그러나 태그 접근 방식은 ES6 가져오기 구문과 일치하지 않습니다. 이는 두 가지 질문을 제기합니다:</p> <ol> <li>semantic-ui의 사용법을 보완하기 위해 ES6 구문을 사용하여 jQuery를 어떻게 가져올 수 있습니까?</li> <li>가져오기는 node_modules/ 또는 dist/ 디렉토리(여기서 앱이 컴파일됨)?</li> </ol> <p><strong>답변:</strong></p> <h3>코드 수정</h3> <p>ES6 구문을 사용하여 jQuery를 효과적으로 가져오려면 index.js 파일을 수정하세요. </p> <pre>import { $, jQuery } from 'jquery'; // Export for other scripts to access window.$ = $; window.jQuery = jQuery;</pre> <h3>소스 가져오기</h3> <p>가져오기 소스는 node_modules/ 디렉터리에서 jQuery를 가져오는 것이 좋습니다. 이 접근 방식은 일반적으로 컴파일 중에 자산이 node_modules/에서 dist/ 폴더로 이동되는 배포 프로세스와 일치합니다.</p> <h3>고려 사항</h3> <ol> <li> <strong>특정 가져오기:</strong> 피하세요. 특정 객체($ 및 jQuery)가 알려진 이 시나리오에서는 불필요하므로 import 문으로 glob *를 사용합니다.</li> <li> <strong>다른 스크립트에 노출:</strong> jQuery를 다른 스크립트에 노출 window.$ = $를 사용하면 프로젝트 전반에 걸쳐 접근성이 보장됩니다.</li> <li> <strong>가져오기 안전성:</strong> 별칭과 이름을 모두 가져오더라도 browserify는 중복을 제거하고 오버헤드를 제거합니다.</li> </ol>