javascript - React making components out of elements -

i putting elements of website making react components out of them. here's button example:

import react       'react';  class button extends react.component {   render() {      return <button classname={this.props.bstyle}>{this.props.title}</button>;    } }  export default button; 

i have lots of other elements put react components there's going large list of them.

the problem have lots of them , need import list can grow big.

just imagine 50 of these:

import element './element.component'; // x50 ? 

my question is...is better approach importing large lists of components in react?

you can import of elements 1 file , export individually. able import elements , use elements.somecomponent.

// common.js because ll commonly use them import element './element.component';  import element2 './element.component2'; // x50 ? /* ... */ export { element, element2 /* ... */ };  // in someotherfile.js import * elements './common'; /*     able use these common elements     <elements.element />     <elements.element2 />    ...  */