webpack知识点

当前web开发面临的困境
1.文件依赖关系错综复杂
2.静态资源请求效率低
3.模块化支持不友好
4.浏览器对高级JavaScript特性兼容程度低
webpack概述
webpack是一个流行的构建工具，可以解决web开发面临的困境。
优点：
1.提供友好的模块化支持
2.代码压缩混淆
3.处理js兼容问题
4.性能优化
webpack的基本使用
1创建一个初始化项目
2.运行 npm install webpack-cil -d 命令，安装webpack相关的包
2.在根目录中，创建名为webpack.config.js的webpack配置
3.在webpack的配置文件中，初始化配置：（development是为压缩，在编码过程中使用这个会更好的编译，但是上线时要更改为prodction）

module.expoets = {
	mode:'development' //mode用来指定构建模式
}

4.在package.json配置文件中的scripts节点下，新增脚本：

"scripts":{
	"dev":"webpack" //script节点下的脚本，可以通过 npm run 执行
}

5.在终端运行 npm run dev命令，启动webpack进行项目打包

webpack配置打包的人口和出口
webpack的4.x版本中默认约定“

• 入口文件为src->index.js
• 输出文件为dist->main.js
  如果要修改打包入口与出口，可以在webpack.config.js中新增如下配置信息

module.expoets = {
	mode:'development', //mode用来指定构建模式
	entry:'入口文件的路径',
	output:{
		path:'输出文件的路径',
		filename:'bundle.js' //输出文件名称
	}
}