如何从零开始学习并配置webpack4的常用设置？

本文共计5279个文字，预计阅读时间需要22分钟。

webpack 的核心价值在于前端源码的打包。它将前端源码中的每个文件（不论类型）打包成一个或多个 pack。之后，webpack 分析依赖关系，最终输出线上运行的代码。webpack 的四个核心部分：entry 规则定义了打包的入口文件。

webpack 的核心价值就是前端源码的打包，即将前端源码中每一个文件（无论任何类型）都当做一个 pack ，然后分析依赖，将其最终打包出线上运行的代码。webpack 的四个核心部分

• entry 规定入口文件，一个或者多个
• output 规定输出文件的位置
• loader 各个类型的转换工具
• plugin 打包过程中各种自定义功能的插件

webpack 如今已经进入 v4.x 版本，v5.x 估计也会很快发布。不过看 v5 的变化相比于 v4 ，常用的配置没有变，这是一个好消息，说明基本稳定。

前端工程师需要了解的 webpack

前端工程化是近几年前端发展迅速的主要推手之一，webpack 无疑是前端工程化的核心工具。目前前端工程化工具还没有到一键生成，或者重度继承到某个 IDE 中（虽然有些 cli 工具可以直接创建），还是需要开发人员手动做一些配置。