配置 output
配置项会告诉 webpack 如何将编译后的文件写入磁盘。请注意,虽然可以有多个 entry
入口点,但只指定一个 output
配置。
你的 webpack 配置中,output
属性的最低要求是将其值设置为一个对象,并提供一个 output.filename
用于输出文件。
webpack.config.js
module.exports = {
output: {
filename: 'bundle.js',
},
};
此配置将输出一个单独的 bundle.js
文件到 dist
目录中。
如果你的配置创建了多个“chunk”(例如有多个入口点或使用 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