reactjs - React 组件 AMD 与 Webpack 捆绑为 Require.js

Question

由于某种原因，我们想在 Backbone 视图上加载 React 组件（使用 Require.js）。这个 React 组件是使用 Webpack 4.x 捆绑的。

我们在 Webpack 配置中捆绑期间启用了 AMD/UMD 模式。

...
...
module.exports = {
  entry: {
    componentName: ['./components/componentName/index.js']
  },
  amd: {
    componentName: true
  },

  output: {
    path: path.resolve(__dirname, './componentName'),
    filename: '[name].js',
    libraryTarget: 'umd',
    library: 'componentName',
    umdNamedDefine: true
  },

  externals: {
    'react': 'react',
    'react-dom': 'react-dom',
    'react-dom-server': 'react-dom-server'
  },
  ...

现在，我们尝试在 Backbone+Require.js 应用程序中使用捆绑的 React 组件，我们正在加载 React 和 ReactDOM（启用 UMD），如下所示

define([
  'jquery',
  'underscore',
  'backbone',
  'react',
  'react-dom',
  'componentName'
], function($, _, Backbone, React, ReactDOM, componentName) {

   ...

   render: function() {
      console.log(React, ReactDOM, componentName)
   }

   ...
});

这里 componentName 总是像undefinedReact 和 ReactDOM 正确加载一样。谁能帮助理解我在这里遗漏了什么？

标签： reactjswebpackbackbone.jsrequire