Webpackを使用して露呈モジュールを要求する

Question

JavaScriptは主にWebkitのJavascriptで提供されるすべてのものを探し始めました。私は明らかにモジュールパターンを使用してまともなサイズのアプリケーションを持っている。これらのモジュールは、他のモジュールのパブリック関数を呼び出して計算を行い、結果を返す。

私のHTMLページに数十のスクリプトが含まれていることを熟考し始めるまで、このパターンを使用していました。だから、私たちはここにいる...

質問の目的のために、私は何が間違っているのかを実証するはるかに簡単なアプリケーションを作った。

私は自分のファイル内に含まれる2つのJavaScriptモジュールを持っている：私は何をしようとしている

​​

はone.js内two.jsからsayHello機能を使用しています。

だから、まず、私はWebpackとexports-loaderをインストールし、次の構成ファイル作成：

module.exports = { 
    entry: './index.js', 
    output: { 
    path: __dirname, 
    filename: 'bundle.js' 
    }, 
    module: { 
    loaders: [ 
     { 
     test: /\.jsx$/, 

     loader: "babel-loader", 
     query: { 
      presets: ['es2015'] 
     } 
     } 
    ] 
    } 
} 

index.jsを私のエントリファイルで、単純に以下の1行含まれていますとき、今

require('./one.js'); 

をこのコードを実行しようとすると、コンソールに次のエラーが表示されます。

Uncaught ReferenceError: two is not defined

もう少し掘りでは

、私はtwo.jsをインポートしようとしたとき、私のコンパイルbundle.jsファイルには、次のエラーを投げていたことがわかった。

throw new Error("Module parse failed: \testing_env\webpack\two.js 'import' and 'export' may only appear at the top level (2:2)\nYou may need an appropriate loader to handle this file type.

明らかに私が何か間違ったことをやっている、私はよく分かりません。私はexports-loaderとbabel-loaderの両方を試しましたが、喜びはありません。

モジュールの依存関係を解析するために使用するローダはどれですか？

ご協力いただければ幸いです。ボックスのWebPACKのうち

Answer 1

は（同じモジュールシステムNodejs implementsある）CommonJSをサポートしています。つまり、モジュールを使用するには構文のrequire/export構文を使用する必要があります。

あなたは、単に行うモジュールで何かエクスポートするには：

// a.js 
function a() { console.log("I'm a module '); } 

module.exports = a; 

をし、あなたがあなたの他のモジュールに：

// b.js 
const a = require('./a.js'); 

a(); // I'm a module 

require()単にexportsオブジェクトを返します。何を置いても、別のモジュールで取得できます。

これはwebpackがモジュールバンドラであり、モジュールシステムが組み込まれている理由です。revelaingモジュールのパターンは、モジュールバンドラなしでJSファイルをブラウザに直接ロードし、データを（モジュールで）カプセル化したい場合に、より実用的です。

Revelaing module patternは、モジュールシステムがなく、ブラウザにJSファイルをロードするだけで便利です。 ESモジュールがブラウザに導入されたときに思い出されるまで、JavaScriptは独自のモジュールシステムを持っていませんでした。これは、人々がモジュールパターンを思いついて、ブラウザのロジックをカプセル化する方法を持っている理由です。しかしwebpackのようなツールのおかげで、現在はES Modulesというシステムを持っているので、ロジックをカプセル化するより良い方法ができます。

これは意味がありますか？