可以通过配置 output 选项，告知 webpack 如何向硬盘写入编译文件。注意，即使可以存在多个 entry 起点，但只能指定一个 output 配置。
用法
在 webpack 配置中，output 属性的最低要求是，将它的值设置为一个对象，然后为将输出文件的文件名配置为一个 output.filename
module.exports = {
output: {
filename: 'bundle.js',
},
};此配置将一个单独的 bundle.js 文件输出到 dist 目录中。
多个入口起点
如果配置中创建出多于一个 "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配置项：
-
path: 指定输出文件的存放目录，通常使用path.resolve(__dirname, 'dist')来指定当前目录下的dist目录作为输出目录。 -
filename: 指定输出文件的名称，可以使用[name]、[id]、[hash]、[chunkhash]等占位符来生成动态的文件名和路径。 -
publicPath: 指定在浏览器中访问输出文件时的公共 URL 前缀，通常用于将静态资源部署到 CDN 上或者在开发模式下使用热更新服务。 -
chunkFilename: 指定非入口 chunk 的名称，通常使用[id]、[name]、[hash]、[chunkhash]等占位符来生成动态的文件名和路径。 -
library: 指定打包后的代码库名称，可以通过全局变量或者 UMD 形式进行引用。 -
libraryTarget: 指定打包后的代码库导出方式，可以使用commonjs、amd、umd、var等常见的导出方式。 -
globalObject: 指定在浏览器环境中执行代码时的全局对象，通常使用window、self、global等全局对象。 -
pathinfo: 指定在生成代码时是否包含文件路径信息，通常用于调试和错误追踪。
高级进阶
以下是对资源使用 CDN 和 hash 的复杂示例：文章来源：https://www.toymoban.com/news/detail-802269.html
module.exports = {
//...
output: {
path: '/home/proj/cdn/assets/[fullhash]',
publicPath: 'https://cdn.example.com/assets/[fullhash]/',
},
};如果在编译时，不知道最终输出文件的 publicPath 是什么地址，则可以将其留空，并且在运行时通过入口起点文件中的 __webpack_public_path__ 动态设置。文章来源地址https://www.toymoban.com/news/detail-802269.html
__webpack_public_path__ = myRuntimePublicPath;
// 应用程序入口的其余部分到了这里，关于webpack之输出(output)的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
