entry-----入口 详解4种情况
1、String --->entry:'./src/js/index.js'
单入口
打包形成一个chunk，输出一个bundle文件
此时chunk的默认名称是main

2、Array --->entry:['./src/js/index.js','./src/js/add.js']
多入口
所有的入口文件最终会形成一个chunk文件，输出出去只有一个bundle文件
只有一个用途：使用HMR功能html不能热更新的解决办法
---->['./src/js/index.js','./src/index.html'],
3、Object
entry:{
index:'./src/js/index.js',
add:'./src/js/add.js'
},
多入口
有几个入口文件就形成几个chunk，输出几个bundle文件
此时chunk名称就是key
4、特殊用法（在应用dll的时候使用）
entry:{
//形成一个chunk,输出一个bundle
index:'./src/js/index.js',
//所有js形成一个chunk，输出一个bundle
add:['./src/js/add.js','./src/js/count.js'],
//react:['react','react-dom']
},

output 中filename 命名
output:{
filename:'js/out.js',
path:resolve(__dirname,'dist')
},
output:{
//当为name时候，如果是入口为string，则为main.js
filename:'js/[name].js',
path:resolve(__dirname,'dist')
},

全面的output

    output:{
        //文件名称：指定名称+目录
        filename:'js/[name].js',
        //输出文件目录，将所有资源输出的公共目录
        path:resolve(__dirname,'dist'),
        //所有资源引入公共路径的前缀 'img/ss.png' =>'/img/ss.png'
        //如果设置为<script src="/js/main.js"></script></body>  不设置为src="js/main.js"
        publicPath:'/', //一般用于生产环境
        chunkFilename:'js/[name]_chunk.js',//非入口chunk的名称 （import引入的被打包出的chunk,optimization 0_chunk.js
        //library是结合Dll使用
        library:'[name]',//如果不写，打包出的js文件是内部调用函数，外部不能调用(function(){})(参数)
        libraryTarget:'window',//将library暴露出来的变量添加到window上browser
        libraryTarget:'global',//放在node上
        libraryTarget:'commonjs'//放在node上
    },

image.png

image.png