ES6導入/導出語法困難

Question

我目前的目錄結構如下，其中+表示文件夾：

+ middleware
  - index.js
  + tracking
    - index.js
    + googleAnalytics
      - index.js
      - logPageView.js
      - trackPanos.js
    + mixpanelAnalytics
      - index.js
      - trackUser.js
- index.js

googleAnalytics和mixPanel目錄中最低級別的index.js文件如下所示：

--/middleware/tracking/googleAnalytics/index.js
import {logPageView} from './logPageView';
import {trackSignup} from './trackSignup';
export const googleAnalyticsMiddleware = [logPageView, trackSignup];

--/middleware/tracking/googleAnalytics/index.js
import {trackPanos} from './trackPanos';
export const mixpanelAnalyticsMiddleware = [trackPanos];

出於某種原因，我能夠通過直接查找相關的文件路徑來成功導入內容 。 這是ROOT index.js：

--/index.js

import {mixpanelAnalyticsMiddleware} from './middleware/tracking/mixpanelAnalytics';
import {googleAnalyticsMiddleware} from './middleware/tracking/googleAnalytics';

// This works! But notice how deep I have to dig.

理想情況下，我想要這樣的東西：

// This does not work!

--/index.js
import * from './middleware';

--/middleware/index.js
export * from './tracking';

--/middleware/tracking/index.js
export * from './mixpanelAnalyticsMiddleware';
export * from './googleAnalyticsMiddleware';

Answer 1

您應該使用import * as xxx語法。

所以，當你有

export const googleAnalyticsMiddleware = [logPageView, trackSignup];
export const mixpanelAnalyticsMiddleware = [trackPanos];

在您要導入的js文件中，

import * as Middleware from './middleware/file/path';
// ...
Middleware.googleAnalyticsMiddleware.doSomething();
Middleware.mixpanelAnalyticsMiddleware.doSomething();