出力

webpack 設定の `output` 設定オプションを設定することで、コンパイルされたファイルをディスクに書き込む方法を webpack に指示します。複数の `entry` ポイントを設定できますが、`output` 設定は 1 つだけ指定することに注意してください。

使用方法

webpack 設定の `output` プロパティの最小要件は、その値をオブジェクトに設定し、出力ファイルに使用する `output.filename` を指定することです。

webpack.config.js

module.exports = {
  output: {
    filename: 'bundle.js',
  },
};

この設定では、単一の `bundle.js` ファイルが `dist` ディレクトリに出力されます。

複数エントリポイント

設定で複数の「チャンク」が作成される場合（複数エントリポイントの場合、または CommonsChunkPlugin などのプラグインを使用する場合）、置換 を使用して、各ファイルに一意の名前が付けられるようにする必要があります。

module.exports = {
  entry: {
    app: './src/app.js',
    search: './src/search.js',
  },
  output: {
    filename: '[name].js',
    path: __dirname + '/dist',
  },
};

// writes to disk: ./dist/app.js, ./dist/search.js

詳細

CDN とアセットのハッシュを使用する、より複雑な例を次に示します。

config.js

module.exports = {
  //...
  output: {
    path: '/home/proj/cdn/assets/[fullhash]',
    publicPath: 'https://cdn.example.com/assets/[fullhash]/',
  },
};

出力ファイルの最終的な `publicPath` がコンパイル時にわからない場合、空のままにして、エントリポイントファイルの `__webpack_public_path__` 変数を介して実行時に動的に設定できます。

__webpack_public_path__ = myRuntimePublicPath;

// rest of your application entry