webpack配置详解【一】 -- entry详解

entry: 入口起点

1. string --> ‘./src/index.js’

  单入口
  打包形成一个chunk。 输出一个bundle文件。
  此时chunk的名称默认是 main

2. array --> [’./src/index.js’, ‘./src/add.js’]

  多入口
  所有入口文件最终只会形成一个chunk, 输出出去只有一个bundle文件。
    --> 只有在HMR功能中让html热更新生效~

3. object

  多入口
  有几个入口文件就形成几个chunk，输出几个bundle文件
  此时chunk的名称是 key

  --> 特殊用法
    {
      // 所有入口文件最终只会形成一个chunk, 输出出去只有一个bundle文件。
      index: ['./src/index.js', './src/count.js'], 
      // 形成一个chunk，输出一个bundle文件。
      add: './src/add.js'
    }

完整代码示例

const { resolve } = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
  entry: {
    index: ['./src/index.js', './src/count.js'], 
    add: './src/add.js'
  },

  output: {
    filename: '[name].js',
    path: resolve(__dirname, 'build')
  },
  plugins: [new HtmlWebpackPlugin()],
  mode: 'development'
};

```.