可以通過配置 ?output? 選項，告知 webpack 如何向硬盤寫入編譯文件。注意，即使可以存在多個 ?entry? 起點，但只能指定一個 ?output? 配置。

用法

在 webpack 配置中，?output? 屬性的最低要求是，將它的值設置為一個對象，然后為將輸出文件的文件名配置為一個 ?output.filename?：

webpack.config.js

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

此配置將一個單獨的 ?bundle.js? 文件輸出到 ?dist? 目錄中。

多個入口起點

如果配置中創(chuàng)建出多于一個 "chunk"（例如，使用多個入口起點或使用像 CommonsChunkPlugin 這樣的插件），則應該使用 占位符(substitutions) 來確保每個文件具有唯一的名稱。

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

// 寫入到硬盤：./dist/app.js, ./dist/search.js

高級進階

以下是對資源使用 CDN 和 hash 的復雜示例：

config.js

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

如果在編譯時，不知道最終輸出文件的 ?publicPath? 是什么地址，則可以將其留空，并且在運行時通過入口起點文件中的 ?__webpack_public_path__? 動態(tài)設置。

__webpack_public_path__ = myRuntimePublicPath;

// 應用程序入口的其余部分