（一）修改输出资源的名称和路径

1. 配置

（一）处理 js 资源

1. 为什么

运行的代码是经过 webpack 编译后，所有 css 和 js 合并成了一个文件，并且多了其他代码。此时如果代码运行出错，那么提示代码错误位置我们是看不懂的。一旦将来开发代码文件很多，那么很难去发现错误出现在哪里。

(1) 为什么

开发时修改了其中一个模块代码，Webpack 默认会将所有模块全部重新打包编译，速度很慢。所以需要做到修改某个模块代码，就只有这个模块代码需要重新打包编译，其他模块不变，这样打包速度就能很快。

webpack的含义

webpack是一个模块打包器（构建工具），它的主要目的是将JavaScript文件打包在一起，打包后的文件用于在浏览器中使用，但它也能够胜任转化，打包，或包裹任务资源。

安装与启动

Webpack 5 发布已经有一段时间了，很多小伙伴都在考虑要不要升级，有没有升级的必要，不知道升级后有哪些改变；

今天我们就来做个对比看看，webpack5 带来了那些全新的改变；

没有对比就没有伤害，为了更好地伤害 webpack 4 , 我们使用 webpack4 和 webpack 5 分别构建一个 React 项目来做对比：

不知不觉webpack已经来到了第5个主要版本，作为目前前端最流行的打包工具之一，新版本的webpack主要带来了哪些新特性，让我们一一盘点一下。

新建项目

• 新建文件目录

探索 Webpack 5 的新特性

1. 前言

本小节将带领大家学习一下如何安装