Question

我正在创建一个HOC以连接容器和代表性组件。

我正在使用webpack进行开发测试和生产。

该软件包导出一个函数，该函数返回react-redux connect组件

在开发中，一切正常。当我构建软件包并链接到生产版本中进行测试时，我得到了

在“ Connect（NameComponentPres）”的上下文中找不到“存储”。将根组件包装在<Provider>中，或者将自定义的React上下文提供程序传递给<Provider>，并将相应的React上下文使用者传递给连接选项中的Connect（NameComponentPres）。

我认为React并不是问题，因为它可以在开发中发挥作用。

这是我的配置

webpack.config.js

const path = require("path");


const outputPath = process.env.BUILD
   ? path.resolve("./build")
   : path.resolve("./test");

const testConfig = {
   mode: "development",
   entry: "./demo/index.js",
   devtool: "inline-source-map",
   externals: "./build/redux-simple-container.js",
   output: {
       path: outputPath,
       filename: "index.js"
  },
  module: {
    rules: [
        {
            loader: "babel-loader",
            include: [path.resolve("./demo")]
        }
    ]
  }
};

const buildConfig = {
  entry: "./src/ReduxSimpleContainer.js",
  mode: "production",
  output: {
      path: outputPath,
      filename: "redux-simple-container.js",
      libraryTarget: "commonjs2"
  },
  externals: ["react", "react-dom"],
  module: {
      rules: [
        {
            test: /\.js?$/,
            use: "babel-loader",
            exclude: /(node_modules)/
        }
    ]
  }
};

module.exports = process.env.BUILD ? buildConfig : testConfig;

.babelrc

{
  "presets": [["airbnb", { "modules": false }]],
  "plugins": ["transform-object-assign"]
}

./ src / ReduxSimpleContainer.js

import { connect } from "react-redux";
const ReduxSimpleContainer = (actions, stateRequested, Component) => {
  ....
  ....
  return connect(
    mapStateToProps,
    mapDispatchToProps
  )(Component);
};

export default ReduxSimpleContainer;

反应redux的构建npm软件包错误

0 个答案: