2016-06-03 3 views
1

jsx-files에 정의 된 반응 구성 요소를 index.js 파일에 번들하려면 어떻게해야합니까?export jsx-components in index.js 파일

구성 요소에 액세스 할 수있는 방법은 import module from "/module"; let C = module.Component;입니다. 와

:

/module 
    index.js 
    Component.jsx 

답변

1
export Component from "./Component" 

당신은 당신의 사용 사례에 대한 수출 기본값을 사용하지 않아야합니다. 모듈 당 하나의 기본 내보내기 만 있습니다. 이 값은 가져 오기가 가장 쉬울 것이므로 "기본"내 보낸 값으로 간주됩니다.

export { default as NamedComponent } from './Component'; 

당신은으로 수출 선호한다 :

export { default } from './Component'; 

명명 수출로 구성 요소를 다시 내보내려면 :려면 기본 내보내기로 구성 요소를 다시 내보내

+0

고마워요,하지만 이건 저의 요지가 아닙니다. 문제는 index.js가 jsx 파일과 호환되지 않는 것 같습니다. – dominik

+0

은 내 코드로 가져 오기 및 내보내기 명령문을 바꾸면 작동하는 코드입니까? – alpha

+0

죄송합니다. 오류가 계속 발생하지 않습니다./ – dominik

2

자세한 내용에 대한 https://developer.mozilla.org/en/docs/web/javascript/reference/statements/export를 참조하십시오 기본값은 index.js입니다. 색인에서 내보내기 만 가능하기 때문입니다.

구성 요소 가져 오기가 다음과 같이 표시됩니다

import Component from './module'; 

하거나, 당신은 이름을 수출 사용하는 경우 : 당신이 확인하고, 파일을 번들 웹팩을 사용하는 가정

import { NamedComponent } from './module'; 

을 수입품은 './Component.jsx' 대신 './Component'을 사용할 수 있습니다. resolve 속성에 .jsx을 포함하고 webpack.config.js :

module.exports = { 
    resolve: { 
    extensions: ['.js', '.jsx'], 
    }, 
};