Webpack无法加载高阶组件？

如何解决Webpack无法加载高阶组件？

我创建了一个如下所示的高阶组件：

import * as React from 'react'

export const ForceMobileHOC = WrappedComponent => {
  return class extends React.Component {
    constructor(props) {
      super(props)
    }

    render() {
      return (
        <WrappedComponent {...this.props} />
      )
    }
  }
}

但是webpack给出了错误：

Module parse Failed: Unexpected token (45:13)
You may need an appropriate loader to handle this file type,currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| 
|     render() {
>       return <WrappedComponent {...this.props} />
|     }
|   }

这是相关的Webpack配置：

module: {
    rules: [
      {
        test: /\.js$/,loader: 'babel-loader',exclude: /core-js/,query: {
          cacheDirectory: './webpack_cache/'
        }
      }
    ]
  }

我之前做过HOC，但从未遇到过类似这样的事情。可能会发生什么？

解决方法

这是进口。我试图导入ForceMobileHOC.JS而不是ForceMobileHOC.js。不知道为什么会出现错误，但这就是解决方案。