Использование webpack и jspm и внешних зависимостей

Question

На каждой странице моего сайта я хочу включить React, React DOM и React Bootstrap с сайта cdnjs.com. У меня уже установлена ​​npm реакция-тиности. То, что я хочу сделать, это написать компонент, который использует реакцию-tinymce для отображения редактора tinymce; когда он связан с помощью gulp, я хочу только связать реакцию-tinymce и мой компонент в my dist.js; Я не хочу, чтобы React, React DOM и React Bootstrap были добавлены в dist.js.

Так что я пробовал внешние (Webpack and external libraries), и я также попробовал браузер-прокладку, но он просто не хочет работать; он просто продолжает говорить, что реакция не определена. Пакет работает только в том случае, если я свяжу React, React DOM и React Bootstrap вместе с реакцией-tinymce и моим компонентом.

Как я пытаюсь отойти от браузера, может ли кто-то предоставить образцы конфигураций для webpack и jspm для этого? На основе Googling это будет просто, но, как и все инструменты javascript, это никогда не так прямо, как вам хотелось бы. Мой компонент такой же простой как:

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import ReactTinyMCE from 'react-tinymce'; 

Then I just try to display using <ReactTinyMCE> 

Спасибо!

Answer 1

Это то, что сработало для меня в моей сборке. От webpack.config.js:

externals: { 
    react: 'window.React', 
    'react-dom': 'window.ReactDOM' 
} 

Он производит следующую в bundle.js:

/* 1 */ 
/***/ function(module, exports) { 

    module.exports = window.React; 

/***/ }, 

и:

/* 88 */ 
/***/ function(module, exports) { 

    module.exports = window.ReactDOM; 

/***/ }