使用webpack和jspm以及外部依赖关系

在我网站的每个页面上，我想包括来自cdnjs.com的React，React DOM和React Bootstrap。我已经安装了npm反应 - tinymce。我想要做的是编写一个使用react-tinymce来显示tinymce编辑器的组件;当它通过吞噬捆绑时，我只想在我的dist.js中捆绑react-tinymce和我的组件;我不想在dist.js中捆绑React，React DOM或React Bootstrap。使用webpack和jspm以及外部依赖关系

所以我尝试了外部（Webpack and external libraries），我也尝试了browserify-shim，但它只是不想工作;它只是一直说反应没有被定义。如果我将React，React DOM和React Bootstrap与react-tinymce和我的组件捆绑在一起，该捆绑仅适用。

由于我试图摆脱browserify，有人可以为webpack和jspm提供示例配置来完成此操作吗？基于谷歌搜索它很简单，但与所有的JavaScript工具一样，它从来没有像你想的那么简单。我的组件很简单：

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

Then I just try to display using <ReactTinyMCE>

谢谢！

来源

2016-02-01 Herman

发生在运行时错误或建造时间？运行时间为 –

。它建立良好。我甚至检查了这个包，它没有包含反应，这很好，因为我已经在browserify和browserify-shim中声明了它作为外部依赖。 – Herman

值得检查的事情：（1）'window.React'是否在控制台上产生任何东西？（2）CDN脚本是否包含在HTML源代码中的捆绑脚本之前？（3）如果你检查你的编译代码，你的React变量是否被赋值为'window.React'？ –

这是在我的构建中为我工作。从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; 

/***/ }

来源

2016-02-01 23:06:31

我坚持使用webpack :)我一定在jspm上做错了什么，但是我不能让它工作。谢谢！ – Herman

使用webpack和jspm以及外部依赖关系

回答

相关问题