反應：運行時加載組件

我有一個組件在應用程序的不同位置彈出。在彈出的組件中，我有幾個按其用法分組的子組件，這些組件已被靜態導入。反應：運行時加載組件

然後我用switch語句來渲染取決於通過道具使用成分的不同羣體。

這是工作正常，但switch語句（和進口）增長。

他們是我可以在運行時傳遞組件並讓它們呈現的一種方式。因此，在任何時候只有一組組件在彈出窗口中存在/實例化？只是想弄死switch語句和靜態進口

僞代碼

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

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

難道這東西的WebPack能做什麼呢？但寧願它是代碼而不是配置？

子組件將有靜態導入等。

希望這是有道理的。

來源

2017-05-16 Rory

是的，有一種叫做異步代碼在Webpack中分裂。

下面是文檔：https://webpack.js.org/guides/code-splitting-async/#require-ensure-

基本上，你可以告訴的WebPack在一些地區建立一個分割點，然後用菜刀技巧，使僅在需要時這些模塊的負載。使用路由可以很容易，因爲react-router已經具備了這種配置，但在清單和註冊系統中這樣做並不難。

來源

2017-05-16 20:53:12 gretro

謝謝你的回答，只需要現在解決這個問題:-)我已經提高了你的答案 – Rory

這似乎是我應該做的

Dynamic System.import with webpack?

Webpacks System.import似乎是答案，但如果有另一種方式請張貼

來源

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

哦，真棒。我會再看一遍。我更喜歡有一個承諾，但這種缺乏功能激怒了我。 – gretro

反應：運行時加載組件

回答

相關問題