Webpack之输出(Output)学习笔记（3）

即使可以存在多个入口起点，但只指定一个输出配置。

用法

在webpack配置output属性的最低要求是，将它的值设置为一个对象，包括以下两点：

• filename用于输出文件的文件名
• 目标输出目录path的绝对路径

//webpack.config.js
const config = {
  output: {
    filename: 'bundle.js',
    path: '/home/proj/public/assets'
  }
};

module.exports = config;

此配置将一个单独的bundle.js文件输出到/home/proj/public/assets目录中

多个入口起点

如果配置创建了多个单独的”chunk”（例如，使用多个入口起点或使用像CommonsChunkPlugin 这样的插件），则应该使用占位符来确保每个文件具有唯一的名称。

{
    entry: {
        app: './src/app.js',
        search: './src/search.js'
    },
    output: {
        filename: '[name].js',
        path: _dirname+'/dist'
    }
}

//写入到硬盘：./dist/app.js, ./dist/search.js

高级进阶

//config.js
output: {
  path: "/home/proj/cdn/assets/[hash]",
  publicPath: "http://cdn.example.com/assets/[hash]/"
}

在编译时不知道最终输出文件的 publicPath 的情况下，publicPath 可以留空，并且在入口起点文件运行时动态设置。如果你在编译时不知道 publicPath，你可以先忽略它，并且在入口起点设置 _webpack_public_path_。

__webpack_public_path__ = myRuntimePublicPath

// 剩余的应用程序入口