关于webpack:webpack-output出口

上一节咱们将了 webpack 的入口 entry，那既然有入口，对应就会有进口。所以本节咱们来讲 webpack 中的进口 output。

output 属性用于指定 webpack 如何输入、以及在哪里输入它所创立的 bundles，以及如何命名这些文件。基本上整个应用程序构造都会被编译到指定的输入门路的文件夹中。咱们能够通过在配置文件中指定一个 output 字段，来配置这些处理过程。

output 输入配置

output 是一个 object 对象，其中蕴含一系列的配置项，其中比拟重要的是 filename 和 path。

• output.filename：配置输入文件的名称，指定一个 string 类型的值。如果只有一个输入文件，则能够把它写成动态不变的。
• output.path：配置输入文件寄存在本地的目录，是一个 string 类型的绝对路径。通常通过 Node.js 的 path 模块去获取绝对路径。

在 webpack.config.js 配置文件中，一个 entry 对应一个 output。

示例：

例如上面这段代码：

module.exports = {
    entry:'./index.js',
    output:{
        path:__dirname,
        filename:'./bundle.js'
    }
}

代码中通过 entry 属性为 webpack 指定了一个入口文件 index.js。通过 output 属性为 webpack 指定了一个进口文件，即 bundle.js。

当 webpack 有多个 entry 的时候，一个 entry 应该对应一个 output，此时输入的文件名须要应用替换符申明以确保文件名的唯一性。

示例：

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

最终在我的项目根目录下的 dist 文件夹中生成 one.js 和 two.js 两个 bundle 文件。