1、面试题：loader（加载器） 和 plugin（插件） 之间的区别

• 翻译：loader 是加载器，plugin 是插件
• 中文解释：
• loader 用于 load 一个文件，
  • 比如 babel-loader 是用来加载高级的 JS 将其变成低版本浏览器支持的 JS；style/css loader 是用来加载 css，将其转变为页面中的<style>标签，是一个文件打包成一个文件；也可以加载图片文件，对图片进行一定的优化
• plugin 用于加强、扩展功能，可能是综合 n 个文件将其打包成一个文件
  • 比如 HtmlWebpackPlugin，用于生成一个 HTML 文件
  • MiniCssExtractPlugin 用于抽取 CSS 的代码将其转变成一个文件的
• loader 功能更加的单一，专注于转化文件这一个领域，而 plugin 功能更加丰富，不仅局限于资源的加载

2、懒加载

• 用 import() 去加载一个文件，获得一个 promise，promise 的 then 前面写成功了做什么，后面写失败了做什么

3、总结

• webpack 的作用包括
  1. 将一个或多个 JS 文件打包成对应的文件
  2. 将一个或多个 CSS 文件打包成对应的文件
  3. 压缩代码
  4. 将高版本的 JS转译成低版本的 JS
• webpack 打包 JS 代码需要用到什么 loader？
  • 无需安装额外 loader，webpack 自带此功能
• webpack 将 CSS 文件引入到 JS 中，并转为 style 标签插入到 head 标签里，需要用到什么 loader？
  • style-loader 和 css-loader
• webpack 将 CSS 代码提取成单独的文件，需要用到什么 plugin？
  • MiniCssExtractPlugin
• webpack 自动生成 HTML 需要用到什么 plugin？
  • HtmlWebpackPlugin