Question

我创建了独立包，我将其包含在React App中。 App本身并不知道它加载的Extension Bundle（下一个XB），但XB确实知道它在里面使用的App和库。如何使用XB编译的App共享库包？我的意思是如果App使用React和React-dom库编译，以使XB从编译中排除并使用这些库而不是从App中使用它们？

我放入webpack配置以排除React编译：

var config = {
//....
    output: {
        library: 'videoEditor',
        libraryTarget: 'umd',
        path: BUILD_PATH+"./../bundles/",
       filename: '[name].bundle.js'
   },
// ...
}

// .... later just extending config if compiling as standalone
config.externals = Object.assign(config.externals,{'react':'React'});

是的，这让我退出Bundle而没有React库（所以它的大小从190KB减少到10KB）。但如果我尝试加载它，我会收到一个错误：

index.js?7afc:1 Uncaught ReferenceError: require is not defined
    at eval (index.js?7afc:1)
    at Object.<anonymous> (video-editor.bundle.js:80)
    at __webpack_require__ (video-editor.bundle.js:30)
    at video-editor.bundle.js:73
    at video-editor.bundle.js:76
    at webpackUniversalModuleDefinition (video-editor.bundle.js:9)
    at video-editor.bundle.js:10

没有外部因素，一切正常。

index.js？7afc：1是

import React from 'react';
import AppLayout from 'layouts/app';

import React from 'react';内部module.exports = require('react');

我不明白如何让需要工作。似乎它对全球空间来说是不可见的。

更新：我试图在任何可用选项上更改libraryTarget：'umd'，'commonjs'，'this'。结果是一样的。

我从webpack知道commonChunkPlugin但我有不同来源的不同来源的几个独立项目。

Answer 1

与React一起，您还需要在React v0.14.x之后的外部添加ReactDOM

externals: {
    // Use external version of React
    "react": "React",
    "react-dom": "ReactDOM"
},

React独立捆绑包，里面没有反应库

1 个答案: