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;

编辑结束

我开发了一个反应/助焊剂库，我需要使用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，并由您在第23行的webpack配置中使用的Babel加载器“转换”。另请注意，该行仅适用于具有“。”的文件。 js“扩展名。由于您的文件扩展名为“.react”，因此您可能需要更改该行。

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

React - webpack导出

1 个答案: