首页
AI Coding
数据标注
NEW
沸点
课程
直播
活动
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
登录
注册
webpack
code_YuJun
创建于2023-09-03
订阅专栏
记录学习 webpack 的笔记和工作中的总结
暂无订阅
共19篇文章
创建于2023-09-03
订阅专栏
默认顺序
默认顺序
最早发布
最新发布
1. webpack 概念
1. webpack、webpack-cli 作用 2. 全局安装 和 局部安装 3. webpack 入口
2. webpack 对样式的处理
1. css-loader 2. style-loader 3. less-loader 4. .browserslist(浏览器兼容性查询过程) 5. postcss 6. importLoader
3. webpack 处理文件资源
文件资源打包 1. file-loader 2. url-loader 3. asset module type
4. Plugin
1. CleanWebpackPlugin 2. HtmlWebpackPlugin 3. DefinePlugin 4. CopyWebpackPlugin
5. 模块化原理
1. webpack 对 common.js 的支持 2. webpack 对 ESModule 的支持 3. webpack CommonJS 和 ESModule 相互导入
6. source-map
1.source-map过程 2.source-map文件组成 3.source-map可选项 4.source-map 最佳实践
7.Babel
1. Babel作用 2. Babel原理 3. Babel命令行使用 4. webpack 中配置 babel
8.polyfill
polyfill 对 Promise, Generator, Symbol等以及实例方法例如 Array.prototype.includes等)做打包,浏览器就可以认识这些语法。
9. webpack 编译 TypeScript
1. ts-loader 编译 2. babel-loader 编译 3. typescript 编译最佳实践
10. ESLint
1. ESLint 作用 2. ESLint 使用 3. 关闭 eslint 检测 4. ESLint-Loader 5. VSCode的ESLint插件 6. Prettier 插件
11. devServer、HMR
1. watch 2. webpack-dev-server 3. HMR 4. 框架的 HMR 5.HMR的原理
12. 路径处理 环境分离
1. output publicPath 2. devServer publicPath 3. 环境分离
13. 代码分割
1. 多入口起点 2. Entry Dependencies(入口依赖) 3. SplitChunks(重点) 4. 动态导入 5. chunkIds
14. DLL库、Terser
1. 什么是DLL 2. DDL库的使用 3. 什么是Terser 4. 命令行使用Terser 5. Terser在webpack中配置 6. CSS的压缩
15. Tree Shaking
1. usedExports 2. sideEffects(副作用) 3. CSS Tree Shaking
16. HTTP压缩、Library发布
1. HTTP 压缩 2. HTTP 压缩流程 3. 封装Library 时间(2023/11/12)
17.webpack 打包分析
打包的时间分析 如果我们希望看到每一个loader、每一个Plugin消耗的打包时间,可以借助于一个插件:speed-measure-webpack-plugin 安装: 使用:将 webpack 全
18. 自定义loader
Loader 的概念 webpack 本身只能识别 js 代码,loader 帮助 webpack 将不同类型的文件转换为 webpack 可以识别的模块。 loader 执行顺序 分类 pre: 前
19. plugin
Plugin 原理 Plugin 的作用 通过插件我们可以扩展 webpack,加入自定义的构建行为,使 webpack 可以执行更广泛的任务,拥有更强的构建能力。 Plugin 工作原理 站在代码逻