-
Webpack5学习大纲笔记
- 五大核心概念
- output：输出
- 指示 Webpack 打包完的文件输出到哪里去，如何命名等
- Loader：加载器
- webpack 本身只能处理 js、json 等资源，其他资源需要借助 loader，Webpack 才能解析
- 常见Loader
- Loader经常处理的资源
- Babel 编译器资源（babel-loader）
- 常见Plugins
- Plugins经常处理的资源
- Eslint语法检查（EslintWebpackPlugin）
- HTML资源（HtmlWebpackPlugin）
- 将CSS以单独的文件输出（MiniCssExtractPlugin）
- 压缩CSS资源（CssMinimizerWebpackPlugin）
- Webpack优化配置
- 优化角度：
- 2.提升打包构建速度
- HotModuleReplacement：局部热更新
- OneOf ：当命中一个loader之后不再验证其他loader
- Include / Exclude ：只编译处理包含的 或 编译处理 Exclude 以外的所有文件
- Cache ：对 Eslint 检查 和 Babel 编译结果进行缓存
- 3.减少代码体积
- 抽离 Babel 对每一个被转换的文件加入的辅助代码，并单独引用
- 4.优化代码运行性能
- Code Split 代码分隔：
- 分割文件：将打包生成的文件进行分割，生成多个 js 文件。
- Preload / Prefetch：
- Prefetch：告诉浏览器在空闲时才开始加载资源。
- Network Cache：
- 静态资源缓存优化，要用contenthash来解决当文件内容发生变化但输出文件名称没变从而导致的浏览器直接读取缓存而不是最新文件的情况
-
相关阅读:
XPS测试加测轨道-科学指南针
Spring原理学习（二）Bean的生命周期与Bean后处理器
什么是关系数据库，你知道吗？
云计算基础技术
Gem5 O3 可视化
2、ARM处理器概论
算法基础知识
DJango 学习（2）—— django引入：借助于wsgiref模块（web服务网关接口）搭建简易 web 框架
Java——包装类
【测控电路】三运放高共模抑制比放大电路
-
原文地址：https://blog.csdn.net/qq_59181609/article/details/126393696