React - webpack 导出

Question

编辑-答案：按要求封装导入工作：

# index.js
var myLibrary {
    ProfileApp: require('./components/ProfileApp.react'),
    ProfileStore: require('./stores/ProfileStore'),
}
module.exports = myLibrary;

我现在可以了

var lib = require('myLibrary');
var ProfileApp = lib.ProfileApp;

编辑结束

我开发了一个 react/flux 库，我需要使用 webpack 对其进行打包。我第一次这样做，我的出口似乎是错误的......（图书馆本身运作良好）。我的（简化）index.js 文件是

# index.js
module.exports = require('./components/ProfileApp.react'); 
module.exports = require('./stores/ProfileStore');
...

代码在 node_modules 中正确编译和安装，但在导入时不起作用。

# whatever.file.doing.imports
var myLibrary = require('myLibrary'); # works well
var ProfileApp = myLibrary.ProfileApp; # works only if I call it --> myLibrary.ProfileApp()
var ProfileStore = myLibrary.ProfileStore; # does not work and  myLibrary.ProfileStore() raises "is not a function error"

我认为我在 index.js 中的导出应该使用另一种语法。例如，React Router (https://github.com/rackt/react-router/blob/master/modules/index.js) 使用

export Router from './Router'; 
# which can be simply instantiated writing
var Router = ReactRouter.Router;

在我的库中使用此语法时会引发错误。你知道我是否必须使用插件才能使用这种语法，或者我是否可以用不同的方式编写它？非常感谢！

Answer 1

React Router 使用的特殊导出语法来自 ES6，并且是 "transpiled" 由您在第 23 行的 webpack 配置中看到的 Babel 加载器使用。另请注意，该行仅适用于文件有一个“.js”扩展名。由于您的文件带有“.react”扩展名，因此您可能需要更改该行。

不幸的是，这并不能解释您必须将 ProfileApp 作为函数调用的问题。也许如果您发布了 ProfileApp 和 ProfileStore 的代码，那会有所帮助。

React - webpack 导出

React - webpack exports

javascript

reactjs

webpack