스크립트가 포함 된 <script src>으로 Browserify 번들/모듈 스크립트를 혼합 할 수 있습니까?

Question

저는 후기에 Browserify를 채택한 프로젝트를 진행하고 있습니다.

많은 React 구성 요소가 수동으로 포함되어 있고 그 구성 요소의 종속성은 일반적인 React 구성 요소를 포함한 몇 가지 파일을 포함하여 <script> 태그로 필요합니다. 내가 처음 반작용 구성 요소에서 일하고 있어요

<!-- includes ComponentA and dependencies, including React --> 
<script src="/js/browserify-bundle.js"></script> 

<script src="/js/react.min.js"></script> <!-- React included here too --> 
<script src="/js/react-dom.min.js"></script> 
<!-- ...more dependencies... --> 
<script src="/js/common-components.js"></script> 
<!-- ...more components/script includes... --> 

는 ES6 모듈로 작성되고 있지만, 때문에 우리의 상황에 모듈 종속성을 두 번로드 끝; 먼저 스크립트 태그에 제공된 수동 종속성에서 가져온 다음 Browserify 번들에서 가져옵니다.

React가 포함 된 스크립트 태그를 제거하면 일반적인 구성 요소가 손상되지만 원인은 그대로 유지됩니다. React duplication errors like this 두 개의 React가 주위에 뜨기 때문입니다.

즉, 예를 들어 Browserify에게 수동 응답 포함을 사용하여이 간격을 일시적으로 줄이는 방법이 없다는 뜻입니까? 이것으로, 우리는 단편적인 Browserify를 시작할 수 있습니다. 모든 구성 요소/스크립트를 ES6 모듈로 만들어 모든 것을 Browserify를 통해 피할 수 없게 만드는 것이 절대적으로 필요합니까?

Answer 1

아마도 상황에 따라 browserify-shim을 사용할 수 있습니다. 은 이미 전역 범위에서 모듈을 사용할 수 있다고 선언 할 수 있습니다. 당신의 package.json에서

: 당신이 지금의 격차를 해소 할 수

"browserify-shim": { 
    "react": "global:React" 
}, 
"browserify": { 
    "transform": [ "browserify-shim" ] 
} 

희망.