2017-06-04 5 views
2

私は次のようにES6モジュール(sender.js)で定義されている機能があります。ブラウザのJavaScriptコンソールでES6モジュールで定義された関数にアクセスするにはどうすればよいですか?

import {send} from "./sender" 

send

function send() { 
    // do stuff 
} 
export {send}; 

このモジュールは、次のようにapp.jsファイルアプリケーションのメインJavaScriptで使用されています関数はファイルで利用可能ですが、FirefoxのJavascriptコンソールではではありません。

> send 
ReferenceError: send is not defined 

send関数をJavaScriptコンソールにインポートするにはどうすればよいですか?

+0

ES 6つのモジュールは任意のブラウザでサポートされているので、私はあなたが使用していると仮定されていませんを参照してくださいバベル、そう? –

+0

はい、私はBabelを使用しています – Chedy2149

+1

webpack、Browserify、またはRollupのようなバンドラを使用していますか? –

答えて

5

ブラウザでグローバルオブジェクト( )に割り当てることで、特定の機能をグローバルとして設定できます。windowです。

import {send} from "./sender"; 
window.send = send; 

それは、デバッグに役立つかもしれないが、あなたは、生産コードでそれを使用しないように注意してください - Why are global variables considered bad practice?

+0

私が思っているのは、 'send'はファイル内で宣言されていて、関数でラップされていないので、グローバルではないはずです。これは 'import'を介してロードされたファイルに固有のものですか? –

+0

@IonicăBizău私はそれがOPが使用しているバンドラに依存すると思います。この動作は、私には論理的だと思われます。なぜなら、アプリケーションがあらゆる機能を公開する必要がないからです。たとえば、[ロールアップは空のファイルに問題のコードを遵守します](https://goo.gl/PM4zOq)。 –

+1

@IonicăBizăuはい、それは彼らに特有です。インポートで読み込まれたファイルはモジュールであり、モジュールには独自のスコープがあります。これがモジュールの目的です。モジュラーであり、グローバルスコープを汚染しません。 – estus

関連する問題