模塊構建失敗：SyntaxError：'import'和'export'只能出現在頂層

Question

在webpack版本v2.1.0-beta.28中他們添加了（我使用的是2.2.0-rc.1）：

add import() as Code Splitting construct. It should be used instead of System.import when possible. System.import will be deprecated in webpack 2 release (removed in webpack 3) as it's behavior is incorrect according to the spec.

所以我轉換：

require.ensure(['./hero/homepage'],() => { 
    require('./hero/homepage') 
}, 'hero-homepage') 

分爲：

import('./hero/homepage') 
    .then(module => module.default) 
    .catch(err => console.error(`Chunk loading failed, ${err}`)) 

但得到：Module build failed: SyntaxError: 'import' and 'export' may only appear at the top level

有什麼我必須添加到webpack配置，以允許導入使用他們建議？

Answer 1

按：

https://twitter.com/addyosmani/status/811958786273333248和https://twitter.com/usefulthink/status/811958593100587009

答案是你需要babel-plugin-dynamic-import-webpack