# webpack常见面试问题
webpack是一个打包模块化javascript的工具,在webpack里一切文件皆模块
- 核心概念:Entry Output Loader Plugins Mode
- 常见的loader:自下而上
- file-loader:把文件输出到一个文件夹中,在代码中通过相对 URL 去引用输出的文件
- url-loader:和 file-loader 类似,但是能在文件很小的情况下以 base64 的方式把文件内容注入到代码中去(包含file-loader的基本功能)
- image-loader:加载并且压缩图片文件
- babel-loader:把 ES6 转换成 ES5
- css-loader:加载 CSS,支持模块化、压缩、文件导入等特性
- style-loader:把 CSS 代码注入到 JavaScript 中,通过 DOM 操作去加载 CSS。
- eslint-loader:通过 ESLint 检查 JavaScript 代码
- sass-loader
- postcss-loader css前缀兼容
- plugin:
- html-webpack-plugin 生成一个index.html可以使用模板
- clean-webpack-plugin 清除掉打包文件内容
- mini-css-extract-plugin 从js中抽离css
- optimize-css-assets-webpack-plugin 压缩css
- workbox-webpack-plugin pwa缓存页面
- add-asset-html-webpack-plugin 单独打包某些文件,如引入的jquery vue等
- 模块热更新 devServer hot设为true