单个模块中的多个 React 组件 [英] Multiple React components in a single module
问题描述
我对整个 browserify 很陌生.我一直在尝试使用 browserify + reactify + gulp 来转换、缩小和组合 React 应用程序.只要我有一个 React.createClass
和一个 module.exports = MyComponent
一切正常.由于我有几个共享组件,我在同一个文件中物理托管并跨项目重复使用,我想导出多个组件.我试过一个数组:
I am new to the whole browserify thing.
I have been trying to use browserify + reactify + gulp to transform, minify and combine a React application.
As long as I have a single React.createClass
with a single module.exports = MyComponent
everything works fine.
Since I have several shared components I physically host in the same file and reuse across projects, I would like to export more than one component.
I have tried an array:
module.exports = [Component1, Component2]
并且还尝试了具有多个属性的对象:
and have also tried an object with multiple properties:
module.exports = {Comp1: Componenet1, Comp2: Component2}
并且还尝试在对象中内联对 createClass
的调用,但这并没有帮助.
module.exports = {Comp1: Componenet1, Comp2: Component2}
and have also tried in-lining the calls to createClass
in the object, but that didn't help.
有没有办法做到这一点,还是我必须将每个组件拆分到一个单独的 JSX 文件中?
Is there a way to do this or do I have to split every component in to a seperate JSX file?
推荐答案
我已将多个组件放在一个文件中,并按照您的建议导出对象.
I have put multiple components in one file and export the object like you suggested.
module.exports = {
comp1: Component1,
comp2: Component2
}
然后在哪里使用它们
var comp1 = require('your/path/to/components').comp1;
var comp2 = require('your/path/to/components').comp2;
这篇关于单个模块中的多个 React 组件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!