在开始上代码之前，先让我们盘一盘什么是webpack中的入口和输入
入口
假设你现在手里有一个水龙头，然后十个人用水管从你这里拿水。你这个龙头就是水的入口，水管就是你和这些人的依赖联系。现在供水局的要来查有多少个人在用你的水，只要顺这水管去查，就ok了。
webpack中的入口文件就是类似与这样的效果，是一个确定直接依赖和间接依赖文件，然后才好将他们统统打包，要不然你在某个地方使用的jquery，而又没有打包对应的依赖库，又怎么能使用呢
输入
webpack 把东西打包之后，放在那里，要不要分类。输出就是webpack放置东西的地方
号概念清楚了上代码
const path = require("path");//这个是node.js自带的路径模块 可以有效的防止不同机器上路劲出现差异问题
module.exports = {
mode: 'development',//配置
//入口配置接收三种类型的参数，string array object,以下分别对每一种进行示范操作
// entry: path.join(__dirname, 'src/index.js'),//使用string 单入口文件可以这样直接定义入口文件地址
// entry: [//使用array
// './src/index.js',//也可以直接使用相对地址，只要你能够确保最终的结果能够和你预期的一样就够了 不过使用这种方法创建的多入口，打包后只会输出一个main.js文件，
// // 为什么？两个原因 1没有配置output 指定输出的文件名 2即便配置了，但使用[]建立多入口的方式也会是webpack无法识别入口文件的标识，也就无法动态生成输入文件名，只能打包成一个main.js
// './src/index2.js'
// ],
// entry: {//使用对象 推荐使用这种方法去作为创建多入口的参数，
// index: path.join(__dirname, 'src/index.js'),//输入文件会默认自动根据这个对象的key值创建输出文件名 这个会创建一个app.js的输出文件
// index2:path.join(__dirname,'src/index2.js'),
// },
entry: () => {//使用方法 其实这个上述几种创建方式没有任何实质上的区别，只要在函数内返回对应的值即可，不过有一点好处就是，这个是动态的
function join(src) {
return path.join(__dirname, 'src/' + src);
}
return {
app: join('index.js'),//可以少敲几个代码
app2: join('index2.js'),
}
},
//还可以使用promise对象
// entry: () => new Promise((success) => success({
// app: path.join(__dirname, 'src/index.js'),
// app2: path.join(__dirname, 'src/index2.js'),
// })),
output: {//输入文件配置
path: __dirname + '/build',//指定输出文件 的地址
// filename: './js/index.js',//指定输入文件名 这个表示在输出目录build/js/index.js文件，如果存在多个入口就不能写死了否则webpack会提示两个输出文件拥有相同的名字错误，
// 可以不指定或是由下面的方法,
// 请注意 在入口文件使用的字符串或者数组作为参数，则输入的文件只会有一个
// filename: "./js/[hash].js",//以入口文件的哈希值来命名
filename:"./js/[name].js",//以入口文件的key值作为输入文件名 列入entry中是{app:"./src/index.js"} 那么对应的输出文件就是 app.js,这个只能是在entry参数为object时使用，其实还有更多别名的使用详情请去webpack官网查询
}
}