使用Webpack导入时出现意外的未定义

我遇到的问题以前从未发生过：我正在使用Webpack + Babel 7编译一个基本的入门浏览器Web应用程序（使用React）。我有三个不同的文件：

1. withAuth.js Auth高阶组件
2. NavBar.js NavBar组件
3. Login.js 登录表格

如果我withAuth在NavBar中导入HOC，就可以了，但是如果我withAuth在Login.js文件中导入了组件，则返回undefined

/** withAuth.js */

console.log('withAuth Loaded');

const withAuth = Child => ChildProps => (
    <AuthContext.Consumer>
        { authClient => <Child {...ChildProps} authClient={authClient} }
    </AuthContext.Consumer>
)

export { withAuth };


/** NavBar.js */
import { withAuth } from 'HOC/Auth';

console.log('NavBar Loaded', withAuth); // <- My HOC

const NavBarComponent = (authClient) => { /* ... My Code ... */ }

const NavBar = withAuth(NavBarComponent);

export default NavBar;


/** Login.js */
import { withAuth } from 'HOC/Auth';

console.log('Login Loaded', withAuth); // <- undefined ??

const LoginFormComponent = (authClient) => { /* ... My Code ... */ }

const LoginForm = withAuth(LoginFormComponent);
//                /|\
//                 |
//    Will produce an Error, withAuth is Undefined

这是我的Webpack配置：

/** webpack.config.js */

module.exports = {
    entry: { core: 'index.js' },
    resolve: {
        alias: {
            HOC: './path/to/hoc/folder'
        }
    },
    optimization: {
        runtimeChunk: 'single',
        splitChunks: {
            chunks: 'all'
        }
    },
    plugins: [ /* Various Plugin */ ],
    module: {
       rules: [ /* My Rules */ ]
    }
}

有人知道我的HOC为什么undefined吗？

编辑：我已经将控制台日志放在树文件中。结果是：

'Login Loaded' - undefined
'withAuth Loaded'
'NavBar Loaded' - function() { }

编辑2：这是文件结构：

app/
|-high-order-component/
| |-auth/
|   |-withAuth.js
|
|-layout-component/
| |-navbar/
|   |-index.js
|
|-pages/
  |-auth/
    |-login.js