未捕获的 ReferenceError：使用 React-Native web 时未定义导出

Question

我正在尝试使用 React-Native Web 将现有的 React Native 应用程序转换为 Web 应用程序。该应用程序现在已成功编译，但页面显示为空白，并且在检查控制台时出现以下错误。

当我们不使用项目文件并使用反应本机元素（如等）制作一个简单的屏幕时，它工作正常View。Text

rnw_blogpost.bundle.js:31234 Uncaught ReferenceError: exports is not defined
    at eval (extends.js:2)
    at Module../node_modules/react-redux/node_modules/@babel/runtime/helpers/esm/extends.js (rnw_blogpost.bundle.js:30586)
    at __webpack_require__ (rnw_blogpost.bundle.js:31231)
    at fn (rnw_blogpost.bundle.js:31457)
    at eval (connectAdvanced.js:1)
    at Object../node_modules/react-redux/es/components/connectAdvanced.js (rnw_blogpost.bundle.js:17465)
    at __webpack_require__ (rnw_blogpost.bundle.js:31231)
    at fn (rnw_blogpost.bundle.js:31457)
    at eval (index.js:1)
    at Object../node_modules/react-redux/es/index.js (rnw_blogpost.bundle.js:17585)

这是我的 webpack.config.js

const path = require('path');

const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');

const appDirectory = path.resolve(__dirname);
const {
  presets
} = require(`${appDirectory}/babel.config.js`);

const compileNodeModules = [
  // Node Modues come here!
].map((moduleName) => path.resolve(appDirectory, `node_modules/${moduleName}`));

const babelLoaderConfiguration = {
  test: /\.js$/,
  // Add every directory that needs to be compiled by Babel during the build.
  include: [
    path.resolve(__dirname, 'node_modules/react-native-uncompiled'),
    path.resolve(__dirname, 'index.web.js'), // Entry to your application
    path.resolve(__dirname, 'App.web.js'), // Change this to your main App file
    path.resolve(__dirname, 'src'),
    ...compileNodeModules,
  ],
  use: {
    loader: 'babel-loader',
    options: {
      cacheDirectory: true,
      // The 'metro-react-native-babel-preset' preset is recommended to match React Native's packager
      presets: ['module:metro-react-native-babel-preset'],
      // Re-write paths to import only the modules needed by the app
      plugins: ['react-native-web']
    }
  }
};

const svgLoaderConfiguration = {
  test: /\.svg$/,
  use: [{
    loader: '@svgr/webpack',
  }, ],
};

const imageLoaderConfiguration = {
  test: /\.(gif|jpe?g|png)$/,
  use: {
    loader: 'url-loader',
    options: {
      name: '[name].[ext]',
    },
  },
};

module.exports = {
  entry: {
    app: path.join(__dirname, 'index.web.js'),
  },
  output: {
    path: path.resolve(appDirectory, 'dist'),
    publicPath: '/',
    filename: 'rnw_blogpost.bundle.js',
    libraryTarget: 'umd'
  },
  resolve: {
    extensions: ['.web.tsx', '.web.ts', '.tsx', '.ts', '.web.js', '.js'],
    alias: {
      'react-native$': 'react-native-web',
      App: path.resolve("src"),
    },
  },
  module: {
    rules: [
      babelLoaderConfiguration,
      imageLoaderConfiguration,
      svgLoaderConfiguration,
    ],
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: path.join(__dirname, 'index.html'),
    }),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.DefinePlugin({
      // See: https://github.com/necolas/react-native-web/issues/349
      __DEV__: JSON.stringify(true),
    }),
  ],
  target: ['node'],
};

这是我的 babel.config.js 的代码

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
};