- 博客(171)
- 资源 (29)
- 收藏
- 关注
RSS订阅原创 【含代码】逆向获取 webpack chunk 下的__webpack_require__ 函数，获悉所有的模块以及模块下的函数
Webpack 打包后的代码是不会直接暴露 __webpack_require__ 函数，目的是为了避免污染全局变量同时也为了保护 webpack 的打包后的模块都隐藏在闭包函数里，达到数据的安全性。而有时我们为了测试某个函数，想直接获取这个内置函数，同时保证这个内置函数能使用其所带的上下文，若单独构建这个函数，创建上下文，难度非常之大，因为这个函数的上下文都在闭包函数里。而__webpack_require__.m 则可以提取所有的模块，所以拿到 __webpack_require__ 是关键。
2025-01-21 18:36:11
937
原创 Webpack 5 混淆插件terser-webpack-plugin生命周期作用时机和使用注意事项
Terser（简要的/简短的） 混淆依据混淆是发生在代码已经 bundle 之后的事情变量或者函数在被引用或赋值时才能被混淆孤立的函数或者变量可能会被移除，但不会被混淆，要通过显式地引用
2025-01-14 19:10:37
796
原创 Electron-Vue 开发下 dev/prod/webpack server各种路径设置汇总
在实际开发中，我发现团队对于这几个路径的设置上是纯靠猜的，通过一点点地尝试来找到可行的路径，这是不应该的，我们应该很清晰地了解这几个概念，以下通过截图和代码进行细节讲解。
2024-12-19 20:25:29
1005
原创 【附源码】Electron Windows桌面壁纸开发中的 CommonJS 和 ES Module 引入问题以及 Webpack 如何处理这种兼容
在尝试让 ChatGPT 自动开发一个桌面壁纸更改的功能时，发现引入了一个 wallpaper 库，这个库的入口文件是 index.js，但是 package.json 文件下的 type:"module"，这样造成了无论你使用 import from 还是 require，都会报 ES Module 引入错误，针对于这个问题，让 GPT 给了很多方案，但是都没有解决实质问题，最终，经过多次测试，发现必须借助打包工具 webpack 才能搞定这个事情。
2024-12-18 17:41:54
1225
1
原创 Electron-Vue 主进程远程调试 & Webpack/Webstorm 打包配置细节记录
很多人应该都不会electron主进程调试，electron-vue 框架给了一种node调试的一种方法，这里记录下来，对很多人应该都有用，另外，对于webstorm对electron的支持，这里也记录一下，方便大家提高开发效率
2024-12-17 01:00:25
829
原创 Webpack 5 @babel/preset-env 与 @babel/polyfill && core-js:3 regenerator-runtime 之间的关系
最早有 Babel polyfill 的概念是接触 ES6 语法时，大概是 2016 年，被 polyfill 坑的时候是 2021 年开发谷歌插件时，经过 webpack 打包的代码中，我竟然看到有东西在重写 Promise，导致了原生的 Promise 不可用，后来我就开始对 Polyfill 进行了解，本文主要还是想彻底搞明白 Babel 怎么针对不同版本下的 ES 高级语法的支持和转化问题，怎么让自己的代码尽可能地少被 Babel 转化，从而利用浏览器原生 API 来提高代码运行速度，以及缩短打包时
2024-12-13 17:40:31
869
原创 Electron-Vue 框架的构成拆解 & 动态 Webpcak 5 打包
在学习 Chromium 源码时发现，Electron 就相当于在 Chromium 源码的基础之上，又追加了 Node.js 的运行环境，并且使得 Node.js 和 Chromium 网页环境可以互相通信，互相取用各自的 API，形成了一个新的浏览器应用，也即 Electron 是 Chromium 浏览器的一个超集，而且 Electron 和 Chrome 内核的对应关系可能更为复杂，并不是很轻易就替换新的 Chromium 内核打造出来新的 Electron 衍生版本的。那是肯定可以执行的。
2024-12-12 16:44:46
1276
原创 WADesk 升级 Webpack5 一些技术细节认识5和4的区别在哪里
因为注入脚本是一整套塞进去的，字体，css，html 都应该打包在一个 js 里面，以 base64 方式注入，其中 dataUrlCondition 这个配置非常棒，只要将 maxSize 设置得足够大，就可以将字体文件也打包到 js 文件里面去，这样就特别方便 DOM 的注入和挂载。因为我们设定了 babel 的兼容 ES12，所以下面这些转化基本都用不到，因为 Chrome 能支持，所以也不需要这些插件，你可以直接用最新的语法，如?批量移除它们，proposal 这些都已经被作为正式版包使用了。
2024-12-11 23:08:53
862
原创 【2024-12】VS2022 编译 Chromium浏览器源码坑点汇总
探索浏览器参数开发时，发现第一步 Chromium 源码编译这块就坑点很多，这里统一记录下，以便未来碰到类似的 Visual Studio 编译时，会遇到同样的问题。遇到问题的关键点，主要还是对于 VS IDE 的不熟练，以及对 C++相关知识的欠缺导致。基于 B 站 Up 主的这个 Chromium 源码编译视频合集进行整理。
2024-12-06 15:17:08
759
原创 【附源码】Electron-Vue 老版脚手架升级Webpack到5 Babel7 Vue2 填坑过程 & Webpack 批量载入配置实现自动化规范化打包过程
结尾遗留的 Webpack 升级到 5 的问题继续开展，在独立构建 Webpack5+Vue2 脚手架成功的前提下，理论上 Electron-Vue 升级到 Webpack5 不应该有任何问题，本文重新整理思路，以肯定可以升级成功的结论前提下，继续探索问题所在，同时打算在解决问题后，重新整理 Webpack 批量构建过程。
2024-12-03 00:14:44
632
原创 Webpack5+Babel7+Vue2 初始脚手架构建Demo（附Webpack起源解说）
很多前端同学总是模糊地知道这就是个打包的工具，再深了就不知道它到底怎么打包的，这里简要说下它是怎么打包的。要从 js 模块化说起，什么叫模块化？模块化的意思就是我们如果要想让代码具有可维护性，而不是将全部代码都塞在一个文件里一次性读入内存，那么我们就必须搞一种动态/静态引入的机制，静态引入顾名思义，就是将代码分门别类放在不同的文件夹下下面，在最后打包的时候，通过运行打包脚本，将原来不同文件目录的代码都追加在一个文件里面，这种叫静态引入。
2024-12-02 22:18:56
1023
原创 Electron-vue 框架升级 Babel7 并支持electron-preload webapck 4 打包过程记录
这种新式 ES 语法不支持打包，如若支持的话，又发现新版的 babel 插件又依赖于 babel7，导致出现 babel 版本冲突，最后的解决方案，则是全面升级 babel 至 babel7，并且适配好 webpack4（目前 electron-vue 框架正在用的），现将整个升级过程记录，同时也完善下.babelrc 配置文件在代码中如何生效的。这些东西虽然不需要记忆，但是的确在以后的打包过程中动态地处理一些东西时非常有用，包括引用路径，引用的资源，甚至定义的不同变量都是能用到的。
2024-12-02 12:38:59
1135
原创 git flow 相关知识 & git rebase 与 merge 合并差异比较
Rebase 冲突：发生在每个提交应用到目标分支的过程中，冲突粒度较小但可能多次出现。Merge 冲突：发生在两个分支合并的整体过程中，冲突粒度较大但只出现一次。两者的冲突处理并没有本质的优劣，关键是根据场景选择合适的合并策略：选择 Rebase：当需要整理历史、保持线性记录时。选择 Merge：当需要保留分支结构、避免篡改历史时。
2024-11-25 12:24:02
1106
原创 axios proxy 和 httpsAgent 的使用差异案例详解
因为 wadesk 开发了本地 http 服务，http 本地服务是运行在 electron-main 的纯 node 环境中的，这个之前探讨了 node 下怎么使用 fetch 时就提到了一个 https-proxy-agent 库，这次使用 axios，发现 axios 自带 proxy 配置项，就没有多想，造成了 4 个小时的时间浪费，此次排查应该作为一个反思例子对待。
2024-09-26 12:37:07
1039
原创 webpack 的打包target讲解 & node环境打包下的文件存储造成不易察觉的坑点
背景electron 主渲进程的打包，以及 preload 的打包，还有注入脚本的打包，这些东西 webpack 本身是自带的，这里主要讲一下 target: node 模式
2024-09-25 22:51:58
418
原创 webpack4 target:“electron-renderer“ 打包加速配置
electron-vue npm run build 打包超级慢的原因不是最终electron-builder环节的问题，而是webpack打包渲染进程的问题，今天经过与ChatGPT一起优化，终于把速度降了大概5倍左右，直接让文件打包速度快了很多。
2024-09-20 16:05:10
1075
原创 Electron-vue asar 局部打包优化处理方案——绕开每次npm run build 超级慢的打包问题
因为组员对于 Electron 打包过程存在比较迷糊的状态，且自己也没主动探索 Electron-vue 打包细节，导致每次打包过程都消耗 5-6 分钟的时间，在需要测试生产打包时，极其浪费时间，为此针对 Electron-vue 打包的几个环节进行拆解，来减少打包时间，提高开发效率。
2024-09-19 16:59:26
1535
原创 Electron 安装包 asar 解压定位问题实战
在开发 Electron 过程中，我们想知道 Electron 打包的最终形态是什么样的，以便我们能更好的理解 Electron 打包的过程，以及逆向来快速追踪一些问题，例如下面这个报错，以前这类报错都是靠猜，现在则可以快速定位，找到源码问题发生点
2024-09-19 16:58:01
783
原创 Electron 集成谷歌扩展实现原理，相关知识点汇集，line插件集成demo，gitee代码，坑点解析
目前谷歌扩展有 50W 之多，覆盖面比较广，而 Electron 又是基于谷歌浏览器内核开发的，如果将两者结合，那么就能大大节省很多开发时间，开发出来的客户端功能却更加丰富，不过 Electron 并没有完美支持谷歌扩展，尤其是谷歌扩展 MV3 版本中提供的大量的 API，Electron 本身都是不支持的，这就给开发者一种误导，Electron 不支持 MV3 的扩展。
2024-08-19 21:37:14
676
1
原创 http/sse/websocket 三大协议演化历史以及 sse协议下 node.js express 服务实现打字机案例 & 负载均衡下的广播实现机制
自从2022年底chatgpt上线后，sse就进入了大众的视野，之前是谁知道这玩意是什么？但是打字机的效果看起来是真的很不错，一度吸引了很多人的趋之若鹜，当然了这个东西的确挺好用，而且实现很简单，之前我用python的demo讲了一下SSE的概念，看起来有很多人看，但是并没有说明白这个原理，这次再彻底把这个原理给说明白，而且我发现通过node.js 的Express框架来说明这个概念更加简洁，所以今天就用Express框架来说明SSE概念，这样对前端同学更加友好。
2024-08-15 18:49:47
1290
原创 Express 单一线程下的协程调度为何还会出现数据库写锁？
在实际开发中发现，通过预测认为 Express 编写的异步框架是基于协程的调度，因为脑补中的协程调度的颗粒度精确到一次请求，也即一次性请求处理完毕后，协程才会切换到另外一个请求，这种想法是幼稚的，原因就是没有彻底理解基于协程编程的概念。转换思维之后，也即任何一个地方都可以创建一个 Promise，然后使用协程调度逻辑，那么就意味着在整个 web 开发过程中，无论是请求的处理，还是数据库的处理，还是其他各种逻辑的处理，都可以做成异步的，并用 Promise 进行封装，然后等待执行结果的返回。在上述这种
2024-08-15 15:37:12
831
原创 Promise 一个基于协程下的任务队列状态管理任务包 解决复杂的异步转同步问题
一直都想写关于Promise的东西，Promise解决的问题特别多，而普通前端就把这东西结合ajax来做一个,如果仅仅作为这样一种东西使用那就太可惜了。
2024-08-15 00:21:41
1163
原创 Electron 集成 Express + p-limit + SQlite WAL读写模式解决并发锁库的问题
经过通信层面的优化后，我们不再走 Electron 提供的内置进程间通信 IPC，改为利用 Express 提供的 Http 本地服务来进行多处直达通信机制，同时利用本地 Sqlite 来保存大量数据，但 Express 提供的本地服务是支持并发请求的，而 Sqlite 是不支持行锁的机制，一旦有写入操作，Sqlite 都是直接锁库，除了采用单表单库减少锁库问题外，另外就是走队列的方式来逐个入库，避免写锁问题。
2024-08-13 16:31:30
471
原创 将浏览器拆成代码，从代码实现层面再聊cookie和session
这个东西可能是我十几年前最开始接触的东西，第一次web开始，就是要做登录注册的功能，当时就涉及到cookie和session，用的还是Java，Java 来做Web本身就够晦涩难懂的了，跟更古老的C做Web开发差不了多少（已C语言的方式做了一个Html的字符串输出的模板引擎），即使现在有了SB好了很多， 但也高度封装了底层代码，甚至好多现在Java开发连servlet是啥东西都不知道了。这篇文章是写给新人的，当然很多老开发者看似懂了，其实也只不过是唯手熟尔，对于底层到底发生了什么，自己能否手敲实现相关的
2024-08-13 13:48:00
919
原创 大前端通用知识学习 - 从抽象层面来汇总整体知识框架，利用AI快速掌握新知识【未完待续】
大前端的学习，结合自己多年开发学习的经验，发现前端都具有几个特征，而这几个特征，很多人只能用具体的表象来描述，比如用安卓方式来说明，用IOS的方式来说明，或者QT的方式来说明等等。我用比较简单的语言概括就是：前端应该就是学习配置，外加用指定的语言来实现具体的行为。实现具体的行为这个事情，在AI时代，已经不算一件难事，目前ChatGPT-4o已经能够通读代码上下文，给出合理的逻辑代码，只要你表达准确，一行代码都不需要写，目前我们的团队，正在改变着开发习惯，而所有程序员的改变，也估计就在这两年了。
2024-08-06 18:43:18
502
原创 Electron 集成SQlite FTS5 实现百万级数据的倒排索引
在产品迭代时，个人版产品已经将联系人和消息实时备份到本地，而消息的备份的目的仍然是为了快速查询对自己有用的上下文，并能快速定位到这些用户以及这些有用的信息。另外包括未来喂给 chatgpt-4o 的数据也是需要调用搜索获取的，也不是全量喂，以减少无用信息的资源浪费。
2024-08-06 16:57:49
662
原创 当你启动一个server.listen(‘8080‘) 时操作系统底层都做了什么?为何比while死循环节省计算机性能？
在网上看了很多帖子，也一直没有时间去看操作系统底层设计，之前一直想不通监听端口这个概念到底在程序层面怎么实现的，今天将我的猜想总结在这里，如有不对，欢迎拍砖，这里纯属记录下自己的整体构想。
2024-08-01 14:37:40
423
原创 VirtualBox 安装Centos 7 避坑指南 SSH连不上 镜像失效 静态网络配置等
几乎每次安装Centos 7 时，都会遇到各种各样的问题，毕竟每次安装动辄就是半年几年，几乎都是在换工作时，有了新机器才会倒腾一次，时间久远，就会忘记一些细节，这次整理一下，避免以后再浪费时间。找到这两篇，发现刚装的centos没办法安装wget，有点恶心，又不想源码安装，也不行xfpt，后来问chapgpt curl也可以，选择腾讯更靠谱些，必定更有钱，能熬得更久。记得网卡别选错了，如果既有wifi，又有有线的笔记本，就会找不到的问题，建议还是关闭其中一个网，然后这里选择有线网比较好。
2024-07-25 18:27:39
556
原创 Electron 企业级开发通信与本地存储实用解决方案
之前写了一篇Electron通信的方式，讲述了一下三者之间的通信机制，比较恶心，后来发现有个@electron/remote，可以让渲染进程直接访问主进程，但遗憾的是，preload.js无法使用这个库，webview更是不可能直接触达主进程，总要通过preload.js绕一圈才能找到渲染进程。为此，我们需要一个新的方式，来解决所有通信链路的问题。
2024-07-22 19:27:13
1315
原创 Electron 渲染进程直接调用主进程的API库@electron/remote引用讲解
remote是个老库，早期Electron版本中有个remote对象，这个对象可以横跨所有进程，随意通信，后来官方认为不安全，被干掉了，之后有人利用Electron的IPC通信，底层通过Promise的await能力，模拟了一个类似的remote对象，即@electron/remote没有当年的remote那么强大，但是也很好用，当然，若觉得自己生命值较长，可以不屑一顾，自己再造轮子。
2024-07-22 18:56:47
1518
原创 Electron 结合 Selenium + chromedriver 驱动服务实现浏览器多开
在调研浏览器多开的过程中，electron 有自带的 browserview，webview，但是上面两个受制于 electron 内核版本限制，升级不够灵活，对新版的网页支持可能不及时，甚至不兼容，必须通过发布新的客户端版本才能解决，此外，这两个组件本身也不稳定，经常内存溢出，如果能改为 chrome 自己开发的浏览器内核来运行，则以上问题解决起来都不会特别吃力，所以才有了对 Electorn 控制浏览器多开的技术调研。下载好之后，找到路径，在地址栏输入 cmd，按回车，即可打开控制台。
2024-07-22 01:36:41
1881
原创 使用Webpack 4打包项目：详细教程教你如何将Git仓库作为npm依赖库，同时支持CSS、Stylus、Sass、Less和图片文件的打包配置
写客户端多分身本地数据交替升级解决方案 - 绝对干货全网难找-CSDN博客发现需要不同的代码库依赖同一个github升级库，这样就能保证主线版本的升级，大家都在一个分支上，并且也方便查看升级代码，比较升级代码，也方便主线代码的升级过程，非常Nice，为此，这里特意进行一个Demo实现。
2024-07-16 18:03:19
325
原创 客户端多分身本地数据交替升级解决方案 - 绝对干货全网难找
开发客户端时，为了应对不同客户的不同需求，大杂烩的客户端往往使得代码非常凌乱，补丁代码越堆越多，但是这并不能让产品的付费转化提高，每个用户都有自己的需求偏重，同时也更在意自己的需求的体验和稳定性，不断地增加更多功能，会使得系统过于庞大，同时还降低了系统的稳定，互相影响是难免的。但如果抽离不同功能形成新的版本，就会出现分裂，渐渐地就会出现底层数据结构的分裂，一旦分开就有走得快的，走得慢的，慢的和快的就会产生结构的不同，为了应对这种结构的自然变化，以及使用者的不可控（对方可能一直用着旧版本），这就造成了版本
2024-07-16 13:32:21
986
原创 谷歌插件中级开发程序员必记手册-开发效率/框架介绍/通信/存储/注入脚本生命周期等
这内容适合有一定开发经验的看，主要介绍一些提高开发效率的方式方法，内容很干，需要自己用谷歌去泡开食用消化。
2024-07-15 15:33:46
716
原创 vue-router history 模式下将所有资源文件js/css/img都存放在oss 利用 cdn 访问整体思路汇总
我们有一个域名https://example.com，但是ssl证书很贵，搞子域名来承接新站点有点费钱，所以我们想用一个目录https://example.com/admin/ 来作为管理后台的站点，这个站点是单页面应用，我又想让其用history router的方式作为路由结构，不然看着一堆#怪怪的。访问 https://example.com/admin/ 就可以访问到你想要的静态站点了，非常nice，看似简单，实则一点也不容易，哈哈！
2024-07-11 19:01:40
752
原创 前端部署自动上传资源文件到cdn/oss 解决路由和访问慢的问题
1，关键点一：/scrm/xxa/xxb 无论建立多少级，oss桶都是自动建立的，无需人手动先把这些目录建立了,例如上面的path对应oss的目录/scrm/xxa/xxb下面，./dist/static下的文件也会被上传到这个目录下，这个目录却不需要先行建立。webpack中引入一个oss上传插件，并且给予其初始参数，插件根据publicPath提供的域名后的path，将打包的文件一个个按照上传到path对应的目录中，并且根据from的路径指示，将./dist/static下的所有文件都按路径上传。
2024-07-09 18:51:45
673
原创 尽量不写一行if...elseif... 什么叫一线法编码规则
程序员编码的最大问题是受制于最初c++面向过程的思维引导，导致后续所有的代码里面，if...elseif...非常多，同时想要让自己的一串代码尽可能处理更多可能的场景，此外，还想将公共逻辑抽出，我们最喜欢做的事情就是，先设置几个变量，然后不断地分析逻辑，不断地追加变量的值
2024-07-07 23:32:38
964
原创 尽量不写一行if...elseif...写出高质量可持续迭代的项目代码
无论是前端代码还是后端代码，都存在着定位困难，不好抽离，改造困难的问题，造成代码开发越来越慢，此外因为代码耦合较高，总是出现改了一处地方，然后影响其他地方，要么就是要修改一个逻辑，结果耗费了大量时间进行改造，代码写得耦合较高，造成这种情况的原因无非就是程序员本身没有管理者的思维，喜欢取巧，合并，凑数，偷懒造成的，说白了，想比做的少，更多的是先动手去干，而不是先想好过去/现在/未来三种情况再干，这样撸着撸着，就会将代码撸得让自己越来越反感，越枯燥！
2024-07-04 18:19:12
497
phpstorm远程调试基于swoole的hyperf框架.docx
2020-07-31
centos7 rpm快速安装rabbitmq3.8.5 php安装amqp扩展 添加延迟队列扩展 避开坑
2020-07-27
centos7 rpm快速安装rabbitmq3.6.5 php安装amqp扩展 避开坑 一步到位安装流程
2020-07-25
win10 协同centos7 共享文件夹方式 实现phpstorm下的swoole的远程debug调试
2020-07-25
windows10环境下php使用selenium+chromedriver来模拟浏览器抓取（坑已填完）
2020-04-15
阿里云点播URL鉴权处理流程
2019-11-06
阿里云OSS ali-oss 6.0 npm代码包带案例修复版本 编译打包js，可以直接引入使用
2019-11-02
win10装PHP7.2的Imagick扩展.zip
2019-08-22
phpstorm 远程调试，远程网页调试，使用远程php命令进行本地debug调试
2019-03-27
PHP 分片下载大文件/视频兼容图片下载大文件迁移设计方案
2019-03-21
阿里云OSS临时授权STS直传视频文件到OSS服务器教程（含所需的核心js代码）
2018-12-30
腾讯课堂自建composer安装包图文详细教程升级版
2018-12-28
php+html5（原代码改进）多进程实现大视频文件无刷新上传
2018-12-26
thinkphp5 console 调试启动脚本
2018-12-09
emoji入库mysql注意事项除了更改utf8mb4最大的坑在这里
2018-11-22
个人总结搭建git服务器仓库采用无密登录方式以及TortoiseGit的用法
2018-11-17
phpstorm常用操作完整说明文档图文word格式个人总结实战使用
2018-11-17
集成IK中文搜索的elasticsearch1.7.4完整运行包直接放linux任意文件夹下即可运行
2018-11-17
爱之谷源代码升级修改版适配PHP5.6修复之前BUG
2016-04-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人