前端面试必考——webpack核心知识点有哪些？

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

webpack 是一款开发工具，面试重点在于配置和使用，原理理解不需要太深。

一、基本配置

1.基本配置包括入口（entry）、输出（output）、加载器（loader）和插件（plugin）。

二、配置和合并

1.配置和merge：将公共配置提取到单独的文件中，然后通过webpack-merge工具合并dev和prod环境的配置。

webpack是开发工具，面试考点重点在配置和使用，原理理解不需要太深。

一、基本配置

1、拆分配置和merge

将公共配置跟dev和prod的配置拆分，然后通过webpack-merge对配置进行整合。

2、启动本地服务

dev环境启动devserver配置。

3、处理ES6

使用babel-loader，针对对应目录的js进行代码转换。

4、处理样式

使用postcss-loader、css-loader、style-loader等，这里有个考点是loader的执行顺序是从后往前执行。

5、处理图片

在dev环境直接使用file-loader进行图片的直接引用，prod环境会使用url-loader对小图片进行base64编码。

6、模块化

webpack天生支持模块化。