以Babel为例，讲述插件的机制
Babel 是一个 JavaScript 编译器 Babel 是一个工具链，主要用于将采用 ECMAScript 2015+ 语法编写的代码转换为向后兼容的 JavaScript 语法，以便能够运行在当前和旧版本的浏览器或其他环境中。下面列出的是 Babel 能为你做的事情： 语法转换 通过 Polyfill 方式在目标环境中添加缺失的功能（通过引入第三方 polyfill 模块，例如 ） 源码转换（codemods） Babel 和...
使用vue3封装一个hooks实时获取麦克风音量
之前是在做一个electron项目中需要去检测音量，检测音量不是为了证明音量本身，而是去看看麦克风是否正常响应。 如图所示：这是一个模仿腾讯会议的音量检测的UI 在浏览器中是无法获取真实设备的电平输入的，所以此方法是通过后去音频数据来计算出音量,并非系统实际音量 使用场景 在web端对麦克风进行检测，看看麦克风是否有效 在electron、Capacitor等以web交互为主开发的应用都可以支持（比如：electron应用） 提示：在检...
使用Web RTC实现微信一对一视频通话竟如此简单
随着前端之路的不断探索，当今的前端时代可谓是大前端时代。当今的前端能做的事情太多太多了，这也有弊端就是前端开发人员们需要不断的学习不断的探索。希望大家可以在前端的道路上越走越远。 回到正题，今天想和大家聊一聊 相关的知识， 可以干什么？它主要是做通信相关的业务比如：视频聊天、语音聊天、直播等。 结果展示 移动端 pc端 Web RTC API 这里的 有很多，我这里就只介绍一下实现一对一视频通话所需要使用到的 。 SDP SDP 全称...
如何优雅的调试 Vue 项目
引言 在前端开发过程中，我们经常会使用 或 语句来进行调试， 优点在于简单易用，缺点就是入侵了代码，缺乏上下文信息，而且可能会造成性能影响，影响开发体验； 语句优点在于可以暂停逐行调试，可以看到完整的调试信息，例如变量、调用堆栈、作用域链等等，缺点是代码入侵，无法支持条件断点，这两种语句虽然我们可以在打包的时候去掉，但是不够优雅，简单的情况下可以用用。 本文以 Vue 项目为例，介绍另一种方式，使用 VSCode Debugger 功能...
新一代富文本编辑器框架lexical入门
是一款 基于 开发的网页端文本编辑框架，具备高拓展性架构，以高可靠性、易用性以及性能表现为核心设计思想。本身不与任何框架绑定，可独立于 、 使用（不过由于 与 的亲和性， 有 版）。使用者可在其基础上建立属于自己的独一无二的文本编辑器 目前在 内部，每天 通过 、 、 、 、 等产品服务千百万用户，稳定性及可靠性值得信赖 的核心包（上图左侧部分）只有22kb，其余能力以 形式提供。框架支持延迟加载， 可以在用户真正操作编辑器的时候再加载...
用expo开发react native实在是太爽了
expo出来已经有一段时间了，发现相关的文章还是比较少的。如果你在开发react native，那么我推荐你赶快使用expo来开发把！ 一、零配置开发，降低开发者的心智负担。如果你之前开发过react native，那么你肯定会遇到要配置java，sdk等一大堆东西，并且版本还要对应上，否则开发不了。甚至说新手也会被这些东西劝退。使用expo后，无需配置这些开发环境，像开发web一样流畅的开发react native。 二、实时真机调试...
面试官：pnpm 那么流行，知道它的源码架构实现吗？🤡
pnpm 作为一个优秀的包管理工具，在如今的前端生态中呈持续发展的趋势，与 npm、yarn 相比，它在底层上做了彻底性的改变，通过软硬链接、并行处理依赖等方式实现了更快更省空间的依赖管理，有效解决了幽灵依赖的问题。 作为程序员，我们不能仅仅把目光聚焦于工具的使用上，而是要有意识地去了解工具的实现原理。这篇文章就会给大家带来 pnpm 的源码结构探究！ 对于 pnpm 在应用和优势上的探究，可以阅读文章： 其他源码阅读文章： 首先我们来...
vue3中使用 vue-pdf-embed 实现pdf文件预览、翻页、下载等功能
往期回顾： 文章目录 vue3中使用 vue pdf embed 实现pdf文件预览、翻页、下载等功能 一、安装 \ 1、安装 \ 二、文件预览 1、\ 结构内容 2、\ 样式 3、\ 基本预览功能实现 4、获取文件总页数 三、翻页 四、缩放 五、下载 六、打印 七、指定页面跳转 八、项目演示 九、参考资料 一、 1、安装 注：此处安装版本为 ，2.x 版本安装的依赖包 版本为 3.x 版本。 注：2024.2.16 更新 无需安装 v...
Vue的nextTick方法源码深度解读
先看看vue官网nextTick方法的定义： 是等待下一次 DOM 更新刷新的工具方法。 当你在 Vue 中更改响应式状态时，最终的 ，而是由 Vue 将它们缓存在一个 中，直到下一个“tick”才一起执行。这样是为了确保每个组件无论发生多少状态改变，都仅执行一次更新。 可以在状态改变后立即使用，以等待 DOM 更新完成。你可以传递一个回调函数作为参数，或者 await 返回的 Promise。 根据官网的定义，修改一个响应式数据后，页...