转译为 ES5,包括根目录外的文件

ecc*_*ecc 5 javascript reactjs babeljs

我有一个项目,其中包含多个应用程序和此结构中的一些常见反应组件:

ui
 - app1
 - app2
 - components
Run Code Online (Sandbox Code Playgroud)

组件中的 javascript 文件是用 ES6 编写的。app1 和 app2 都有这个 webpack 配置:

var path = require('path')

module.exports = {
  entry: ['babel-polyfill', './src/index.js'],
  module: {
    rules: [{
      test: /\.jsx?$/,
      include: [
        path.resolve(__dirname, '../components'),
        path.resolve(__dirname, 'src')
      ],
      loader: 'babel-loader'
    }]
  },
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  resolve: {
    alias: {
      InputComponents: path.resolve(__dirname, '../components'),
    }
  },
}
Run Code Online (Sandbox Code Playgroud)

巴别配置:

{
  "plugins": [
    "transform-async-to-generator",
    "glamor/babel"
  ],
  "presets": [
    "es2015",
    "react",
    "stage-0"
  ]
}
Run Code Online (Sandbox Code Playgroud)

我的代码:

import React, { Component } from 'react'
import { Button } from 'CommonComponents'

export default class ButtonView extends Component {
  render () {
    return <Button>GO!</Button>
  }
}
Run Code Online (Sandbox Code Playgroud)

我希望使用 Babel 构建我的组件和应用程序并将其转换为 ES5。应用程序工作但外部组件无效,我收到如下错误:

Module build failed: SyntaxError: Unexpected token (6:34)

  4 | class Button extends Component {
  5 |   render () {
> 6 |     if (this.props.stroke) return <ButtonStroke {...this.props} />
    |                                   ^
Run Code Online (Sandbox Code Playgroud)

如何确保 babel 转译我的外部组件?