React : 런타임로드 구성 요소

응용 프로그램의 다른 지점에서 팝업되는 구성 요소가 있습니다. 팝업 구성 요소에 몇 가지 하위 구성 요소가 용도에 따라 그룹화되어 있습니다.이 구성 요소는 이미 에서 가져 오므로 정적으로입니다.React : 런타임로드 구성 요소

나는 다음. 전달 소품 사용에 따라 구성 요소의 다른 그룹을 렌더링하는 스위치 문을 사용

이 확인 작업을하고 있지만 switch 문 (수입)이 증가하고있다.

런타임에서 구성 요소를 전달하여 렌더링 할 수있는 방법입니다. 즉, 한 번에 하나의 구성 요소 그룹 만 팝업에 표시됩니다. 그냥 스위치 문 및 고정 수입

의사 코드

<renderPopup children={[ componentA, componentB ]} /> 

<renderPopup children={[ componentA, componentB, componentC ]} />

멀리 할 웹팩이 할 수있는이 뭔가를하려고하고? 그러나 그것은 config가 아닌 code가 선호됩니까?

하위 구성 요소에는 정적 가져 오기 등이 있습니다.

희망적입니다. 이 보인다

출처

2017-05-16 Rory

네, 뭔가라는 비동기 코드를 게시하시기 바랍니다해야 무엇을 할 수 Webpack에서 분할. https://webpack.js.org/guides/code-splitting-async/#require-ensure-

기본적으로, 당신은 다음 몇 가지 영역에서 분할 지점을 만들 웹팩에게 필요한 모듈 만로드하기 위해 칼 트릭을 사용할 수 있습니다 : 여기

는 문서입니다. 경로를 사용하면 react-router에 이미 처분이 있기 때문에 쉽게 처리 할 수 있지만 매니페스트 및 레지스트리 시스템을 사용하는 것은 그리 어렵지 않습니다.

출처

2017-05-16 20:53:12 gretro

답장을 보내 주셔서 감사 드리며, 지금 당장이 사실을 기억하십시오 :-) 나는 당신의 대답을 올렸습니다. – Rory

내가 System.import

Dynamic System.import with webpack?

Webpacks 을하고 대답을 보이지만 다른 방법이 있는지

출처

2017-05-16 20:47:27 Rory

'System.import'는 더 이상 사용되지 않습니다. 그들은 이제'import()'를 사용할 것을 권장합니다. (https://webpack.js.org/guides/code-splitting-async/#system-import-is-deprecated) 여전히'require.ensure'를 선호하는데, 그 이유는 청크의 이름을 정할 수 있기 때문입니다. – gretro

@gretro'import()'에 청크 이름을 지정할 수 있습니다. 버전 2.4.0에서 추가되었습니다. https://github.com/webpack/webpack/releases/tag/v2.4.0 – Everettss

아, 끝내 줘. 다시 한번 살펴 보겠습니다. 나는 Promise를 갖는 것을 선호했다. 그러나이 기능성 결여는 나를 짜증나게했다. – gretro

React : 런타임로드 구성 요소

답변

관련 문제