ES6を使用しているとき、インポートされた関数はどのようにして別のファイルで定義されていないのですか？

Question

私はwebpackでbabel/ES6を使用しています。私は2つの異なる場所で - 束の機能をエクスポートする - 同じ 'アクション'ファイルをインポートしています。それがあったのでApp.jsが働い 理由だった

export function test() { ... } 
export function test2() { ... } 

App.js

import actions from './actions' 
class App extends React.Component { ... } 
console.log(actions);   //<-------- Object{test:function,test2:function) 
export default connect((state) => { ... },actions)(App); 

編集actions.js

：一つの場所で、それはモジュール、他のundefinedを返します。実際にはimport * as actionsを以下のように使用していますが、例では正しく入力しませんでした。

NestedComponent.js

これは、webpackがモジュール/ファイルを定義する順序に関連していますか？

Answer 1

誤った値をインポートしているため、どちらの場合でも動作しません。 import foo from '...'デフォルトのモジュールのエクスポートをインポートしますが、デフォルトのエクスポートはありません。名前付きのエクスポートのみです。

あなたは冗談でテストしていると自動モック動作が有効になっている場合、あなたが使用する必要があることは、この問題が発生した

import {test, test2} from './actions'; 
// or 
import * as actions from './actions'; 

Answer 2

他の一般的な場合があります。そのような苦労、多くの悲しみ。

Answer 3

循環依存によって引き起こされた同様の問題が発生しました。ファイル 'A'からファイル 'B'から定数をインポートしようとしましたが、ファイル 'A'からインポートしようとしました。