の解決のエクスポート/インポート

Question

私は、次の

(function(){ 

    window.GlobalObject = { 
     foo : function() { console.log("bar"); } 
    } 

})(); 

ようなものでNamespacing.jsを持って、私はので、私は今のWebPACKにバンドルしていると私は別だったMyScript.js

GlobalObject.newAttribute = { ... } 

を持っていますこの上でモジュールを使用するtryng、しかし私はそうすることができませんでした。 Namespacing.jsで

私は最後に追加：

export default GlobalObject; 

それから私はMyScript.js

import GlobalObject from "Namespacing" 

でそれをインポートするにはしようと試みた。しかし、その後、私のWebPACKは私にエラー

[14:58:44] GulpUglifyError: unable to minify JavaScript 
Caused by: SyntaxError: Unexpected token: name (Kneat) (line: 1, col: 7, pos: 7) 

を取得

any1はこのエクスポート/インポートを実行する良い方法を知っていますか？

Answer 1

import/exportに切り替えるには、既存のファイルにexportsを追加するだけではなく、その構造を（少しだけ）変更する必要があります。例えば

、Namespacing.jsはどちらかだろう。

export const GlobalObject = { 
    foo : function() { console.log("bar"); } 
}; 

...という名前のシンボルGlobalObjectをエクスポートします。

（インポートモジュールに局所的に異なる名前を望んでいた場合は、as句を使用することができます。）

import { GlobalObject } from './Namespacing.js'; 

それともデフォルト輸出として、そのオブジェクトをエクスポートすることができます：それは次のようにインポートされます：

export default { 
    foo : function() { console.log("bar"); } 
}; 

...とこのようにそれをインポートします。

import GlobalObject from './Namespacing.js'; 

この場合、インポートするモジュール内でGlobalObjectに任意の名前を使用できます（as節の必要はありません）。

---

IIFEを削除することを心配しないでください。モジュールは本質的にスコープがあり、モジュールコードはグローバルスコープで実行されません。