摘要：
plugin是webpack生态的重要组成，它为用户提供了一种可以直接访问到webpack编译过程的方式。它可以访问到编译过程触发的所有关键事件。 1. 基本概念 1. 如何实现一个插件 1. plugin实际是一个类（构造函数），通过在plugins配置中实例化进行调用。 2. 它在原型对象上指定 阅读全文
摘要：
想要实现一个loader，需要首先了解loader的基本原理和用法。 1. 使用 loader是处理模块的解析器。 2.自定义loader的查找规则 很多时候，我们可以自己定义loader, 比如在根目录下新建一个loaders的文件夹，文件夹内实现各个loader的代码。但是webpack不识别这 阅读全文
摘要：
1. devtool代码调试 1. 生产模式下 source-map: 生成一个map文件，直接定位到源码的行列 ✅可以使用该模式，用于测试服务器 cheap-source-map: 只能定位到行，且只能定位到babel转码后的代码 cheap-module-source-map: 只能定位到行，但 阅读全文
摘要：
通过使用插件和配置插件的参数。 1. 打包速度分析 首先通过speed-measure-webpack-plugin分析打包的各个插件和loader的耗时。然后具体问题，具体分析。 按照插件 使用时该插件需要将整个配置对象包裹 2 启动js压缩插件的并行和缓存配置 webpack中对js进行压缩的插 阅读全文
摘要：
webpack打包的体积越小，对于部署应用的网站来说，性能越好，加载速度越快。 1. 分析打包文件 1. 生成统计信息文件 首先需要通过webpack命令生成统计信息的文件。在package.json的脚本中添加命令 上面的命令会在根目录下生成一个stats.json的打包统计信息文件。 2. 可视 阅读全文
摘要：
随着项目的增大，项目运行速度会越来越慢，导致影响开发进度。需要提升开发时代码的运行速度。 1. ScopeHoisting作用域提升 该插件在production模式下默认开启。development下需要手动启动。 1 .使用条件 和TreeShaking一样，必须使用ES6的模块，使用impor 阅读全文
摘要：
1. Request Header 用于说明请求来自哪个站点，使用时对应服务端Access-Control-Allow-Origin 示例： 指明目标服务器的域名和端口。必须存在，否则会出现400错误。 示例： 示例： 多数情况下，它是当前页面的路由地址。（Origin的完整版） 当从一个网站访问另 阅读全文
摘要：
MIME类型，也叫媒体类型。用来定义一个文档/文件/字节流的性质和格式。 大小写不敏感，但是一般都是小写。 通用格式如下： type/subType // 其中type是主类型，分为单独类型和复合类型两种。 // 单独类型（根据文件分类）有：text（普通文本）、application（二进制数据） 阅读全文
摘要：
meta标签是网页元标签。可以定义一些网站的功能。 1. name属性 name属性的通用格式如下： 常见的值有如下几种： 1. viewport 定义浏览器窗口的视窗为自适应大小 2. keywords 指定当前页面对于搜索引擎的关键字 3. description 告诉搜索引擎当前页面的主要内容 阅读全文
摘要：
浏览器缓存是优化网站，提升网站性能的有效方法。 浏览器缓存一般指对服务器返回静态资源（html、js、css文件，图片，数据）在客户端的备份。（不考虑ajax请求） 👇基于Chrome浏览器版本 78.0.3904.97（正式版本）;firefox默认过期时间都是0，设置其他值也无效。 1. 浏览 阅读全文