动态导入webpack 4

Question

假设我有课程bar.js

export default {
  sayBar(){
    alert('bar');
  },
}

现在在索引中我希望懒得加载点击 index.js

$('#test').on('click',(e)=>{
    import(/* webpackChunkName: "lazy-vendors/bar.js" */ './partials/bar').then( ({bar}) => {
        bar.default.sayBar()
    });
});

编译工作正常，但index.js为空 部分用于webpack配置

{
  test: /\.js$/,
  exclude: /(node_modules|bower_components)/,
  use: {
    loader: 'babel-loader',
    options: {
      presets: ['@babel/preset-env'],
      plugins: ['@babel/plugin-syntax-dynamic-import','@babel/plugin-transform-runtime']
    }
  }
}

.babelrc

{
  "presets": [
    ["@babel/preset-env", {
      "targets": {
        "browsers": ["last 2 versions", "safari >= 7","ie>=11"]
      }
    }]
  ]
}

如何启用promise和import（）poliy？