首页
沸点
课程
数据标注
HOT
AI Coding
更多
直播
活动
APP
插件
直播
活动
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
登录
注册
确定删除此收藏集吗
删除后此收藏集将被移除
取消
确定删除
确定删除此文章吗
删除后此文章将被从当前收藏集中移除
取消
确定删除
编辑收藏集
名称:
描述:
0
/100
公开
当其他人关注此收藏集后不可再更改为隐私
隐私
仅自己可见此收藏集
取消
确定
webpack
订阅
billkang
更多收藏集
微信扫码分享
微信
新浪微博
QQ
11篇文章 · 0订阅
轻松理解webpack热更新原理
一种是页面刷新,不保留页面状态,就是简单粗暴,直接window.location.reload()。 另一种是基于WDS (Webpack-dev-server)的模块热替换,只需要局部刷新页面上发生变化的模块,同时可以保留当前的页面状态,比如复选框的选中状态、输入框的输入等。…
看完这篇,面试再也不怕被问 Webpack 热更新
Webpack热更新( Hot Module Replacement,简称 HMR,后续均以 HMR 替代),无需完全刷新整个页面的同时,更新所有类型的模块,是 Webpack 提供的最有用的功能之一。 HMR 作为一个 Webpack 内置的功能,可以通过 --hot 或者 …
webpack原理解析(一)实现一个简单的webpack
Webpack 是当下最热门的前端资源模块化管理和打包工具。它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源。还可以将按需加载的模块进行代码分隔,等到实际需要的时候再异步加载。webpack如此强大,其内部机制到底是怎样的,今天我们来一探究竟。 接下来借助@…
webpack原理解析(三)plugin机制
在之前的文章中,我们了解到了webpack的打包机制和loader,loader 用于转换某些类型的模块,而plugin则可以用于执行范围更广的任务。包括:打包优化,资源管理,注入环境变量。插件目的在于解决 loader 无法实现的其他事。所以我们很有必要探究一下webpack…
webpack原理解析(二)实现一个简单的Loader
webpack中 loader 是一个非常重要的概念,loader 可以简单的理解成一个文件处理器,webpack使用 loader 来处理各类文件,比如 .scss转成成 css文件, 小图片转换成base64图片。 本质上讲,loader 只是导出为函数的 JavaScri…
Webpack源码解读:理清编译主流程
webpack的熟练使用已成为当代前端工程师必备的生存技能。毋庸置疑,webpack已成为前端构建工具的佼佼者,网络上关于如何使用webpack的技术文档层出不穷。但鲜有能将webpack的构建流程讲清楚的。本文尝试从解读源码以及断点调试的方式,来探究 webpack 是如何一…
Webpack揭秘——走向高阶前端的必经之路
随着前端工程化的不断发展,构建工具也在不断完善。作为大前端时代的新宠,webpack渐渐成为新时代前端工程师不可或缺的构建工具,随着webpack4的不断迭代,我们享受着构建效率不断提升带来的快感,配置不断减少的舒适,也一直为重写的构建事件钩子机制煞费苦心,为插件各种不兼容心灰…
Webpack 案例 —— vue-loader 原理分析
OK,如果你不是特别清楚,那接着往下看吧,下面我们会拆开vue-loader的代码,看看SFC内容具体是怎么流转转换,顺便还能学学 webpack loader 的编写套路。 如代码第16行,定义pitcher对象,指定loader路径为 require.resolve('./…
分享一份 Webpack 知识图谱
二更,在线地址:https://gitmind.cn/app/doc/fac1c196e29b8f9052239f16cff7d4c7 内容稍有 diff,以线上为准 直接贴图:
[万字总结] 一文吃透 Webpack 核心原理
解析 webpack 核心流程与插件架构,理解: - Webpack 从启动到输出 bundle,内部逻辑流转过程 - 编写 webpack 插件前,你需要弄清楚哪些问题