这是跟着一个视频学的，他当时使用的是 webpack 4，所以之后的文章基本都是 webpack4 的

为什么需要构建工具

• 转换ES6语法
• 转换JSX
• CSS前缀补全/预处理器
• 压缩混淆

• 图片压缩

  前端构建演变之路

  

  为什么选择webpack

• 社区生态丰富

• 配置灵活和插件化扩展
• 官方更新迭代速度快

初始webpack

配置文件名称

• webpack默认配置文件webpack.config.js
• 可以通过webpack --config 指定配置文件
  • 如npm run webpack --config webpack.dev.js

    webpack配置组成

    

环境搭建，安装webpack

1. 新建文件夹
2. npm init -y，初始化package.json
3. 安装webpack，npm install webpack webpack-cli --save-dev

开始学webpack，记录我的webpack版本

• node.js：v14.7.0
  • 查看方法node -v
• npm：v6.14.7
  • 查看方法npm -v
• webpack：v5.51.1
  • 查看方法npx webpack -v
• webpack-cli：v4.8.0
• webpack-dev-server：v4.0.0