[React] export 여러개 하기

 

export 여러개 하기

2개의 컴포넌트를 export하기 위해 아래와 같이 작성하면 에러가 난다. "Only one default export allowed per module" 

function Component1(props){
    return(
        <div>함수형 컴포넌트1</div>
    );
}

const Component2 =(props) =>{
    return(
        <div>함수형 컴포넌트2</div>
    );
}


export default Component1;
export default Component2;

 

 

 

 

 

export {Component1, Component2} 

아래와 같이 작성하면 된다.

import React from 'react';

function Component1(props){
    return(
        <div>함수형 컴포넌트1</div>
    );
}

const Component2 =(props) =>{
    return(
        <div>함수형 컴포넌트2</div>
    );
}


export  {Component1 , Component2}

 

import logo from './logo.svg';
import './App.css';
import {Component1,Component2} from './ComponentEx';

import React from 'react';

class App extends React.Component{
  render(){
    return(
      <div className="App">
        <Component1></Component1>
        <Component2></Component2>
      </div>
    );
  }
}
export default App;

 

 

 

 

 

 

 

참고사이트 : https://stackoverflow.com/questions/46039976/exporting-multiple-modules-in-react-js