- 博客(492)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 Vue3 + Vite 项目自动化部署到服务器
本文介绍通过SSH方式将项目部署到自有服务器的完整流程。首先配置SSH免密登录：生成密钥对并将公钥上传至服务器。然后创建自动化部署脚本(deploy.sh)，使用rsync命令高效同步构建产物到服务器指定目录。执行脚本前需确保：1)服务器目录有写入权限；2)防火墙开放相关端口；3)本地构建正常。文中还提供了常见问题解决方案，如权限不足、构建失败等情况下的处理方法。该方案适用于需要部署到云服务器的场景，通过自动化脚本简化部署流程。
2025-12-26 11:48:42
692
原创 Vue3 + Vite 项目使用 GitBash 自动化部署GitHub
本文介绍如何使用GitBash实现Vue3+Vite项目自动化部署到GitHub Pages。主要内容包括：1）前置准备，确保项目能正常构建并配置GitBash；2）部署到GitHub Pages的具体步骤，包括配置Vite基础路径、编写自动化部署脚本（包含构建、提交、推送全流程）以及执行脚本；3）注意事项，如首次部署后需在GitHub仓库配置Pages源，推送失败检查SSH配置等。通过创建deploy.sh脚本可实现一键部署，适合Windows环境下使用GitBash的前端项目部署需求。
2025-12-26 11:11:16
424
原创 小程序图片转换Base64格式的三种方法
本文介绍了三种在小程序中获取图片Base64编码的方法：1）使用wx.request()请求网络图片并转换为Base64；2）通过wx.getFileSystemManager().readFile()读取本地/拍摄图片；3）利用Canvas绘制图片后转换为Base64数据。三种方法分别适用于不同场景（网络图片/本地图片），均通过Promise处理异步操作并最终返回带格式前缀的Base64字符串。
2025-09-19 16:47:59
1028
原创 花式console.log日志
该代码实现了一个美化控制台日志打印的工具函数prettyLog()，包含多种日志类型和样式。主要功能包括：1) 提供info、error、warning、success四种带颜色的日志方法；2) 支持表格(table)和图片(picture)的特殊打印；3) 在生产环境自动禁用日志；4) 采用CSS样式美化控制台输出，包括圆角边框、背景色等效果。该工具通过返回包含各方法的对象，可以方便地调用不同风格的日志输出，提升开发调试体验。
2025-09-19 16:41:02
276
原创 axios无感刷新
本文介绍了基于axios的HTTP请求封装，重点实现了无感刷新Token机制。通过拦截器处理请求头添加Token，并在响应拦截器中检测401错误触发静默刷新。核心逻辑包括：维护请求等待队列、刷新Token期间暂停请求、Token更新后重发待处理请求。代码实现了startRefresh、waitingRefresh、refreshToken等关键函数，确保Token过期时用户无感知，同时保证请求最终正确执行。这种方案有效解决了前端应用中Token过期导致的频繁登录问题。
2025-09-19 16:35:47
391
原创 封装一个通用的懒加载组件
本文介绍了基于IntersectionObserver实现的懒加载组件原理及实现。该组件通过监听元素是否进入可视区域来延迟初始化，避免资源浪费。核心特点包括：异步非阻塞、高效资源利用、多元素监控和自定义阈值。代码展示了LazyContainer组件的实现，包含骨架屏占位和800ms延迟加载机制。调用示例显示该组件能有效解决多组件同时渲染导致的页面卡顿问题。关键注意事项包括：设置适当的延迟时间确保过渡自然，以及保持懒加载组件与目标元素尺寸一致。该方案显著提升了页面加载性能和用户体验。
2025-09-19 16:33:06
412
原创 浏览器多个tab页之间的通信
摘要：本文介绍了如何使用BroadcastChannel API实现浏览器标签页间通信。发送方Tab页通过创建指定ID的频道发送消息，接收方Tab页监听相同ID的频道并处理消息。示例代码展示了消息发送、接收的基本流程，以及在组件卸载时关闭频道以防止内存泄漏的最佳实践。这种跨标签页通信方案适用于需要实时数据同步的场景。
2025-09-19 16:29:05
276
原创 DeepSeek R1模型的本地化部署
本都部署的优势：隐私保障：所有数据均存储在本地，避免敏感信息泄露。零额外成本：DeepSeek R1 免费运行，无需订阅或额外费用。完全控制：可以进行微调和本地优化，无需外部依赖。
2025-02-07 16:22:46
1344
原创 JS二进制文件转换：File、Blob、Base64、ArrayBuffer
【代码】JS二进制文件转换：File、Blob、Base64、ArrayBuffer。
2024-02-28 15:11:36
2055
1
转载 Vue 加载远程组件的解决方案
远程组件的方案其实不止上面两种，比如还有直接加载.vue文件的方案，有个现成的插件能用。一般来说，加载远程组件的应用场景比较少，所以网上能搜到的讨论也比较少。目前比较常见的应用场景应该就是在低代码平台中加载远程组件了。
2024-01-16 10:39:52
835
原创 uniapp使用wxml-to-canvas开发小程序保存canvas图片
uniapp使用wxml-to-canvas开发小程序保存页面为图片、常用保存为海报图。
2024-01-10 14:35:08
6296
3
原创 react 18 Hooks扩展函数式组件的状态管理
（注：副作用的来源：配置文件、用户的输入、数据库等等，所有的外部交互都有可能产生副作用，副作用会给程序带来安全隐患和不确定性，要尽可能的控制副作用在可控制的范围内发生。以下是一个使用Hooks扩展函数式组件的示例。
2023-12-22 14:37:34
1099
原创 react v-18父组件调用子组件的方法和数据
react v-18父组件调用子组件的方法和数据 子组件 (通过useImperativeHandle() 抛出）
2023-12-21 16:46:46
2875
原创 el-date-picker限制选择7天内&禁止内框选择
需求：elementPlus时间段选择框需要满足：①最多选7天时间。内框输入都变成只读状态。
2023-12-13 16:39:50
2947
原创 大量使用 if else 的优化版
函数就变得非常简洁，有的同学可能会问这有什么用呢？这不是更加麻烦了吗？函数中有1000个判断分支，并且还具有大量的根据判断结果来执行的处理代码，并且。介绍了两种代码分支优化的思想，代码的实现非常简单，重点在于这种思想的应用。文件，之后在需要使用的地方导入即可。函数会返回这个处理后的判断结果的值。是如何返回值的我们并不关心），之后对。通过模块化的开发也可以将这个。上面例子中我们定义的这个。如果你不进行分支优化，函数我们能够知道，它从。获取了一个值赋值给了。
2023-11-28 16:46:40
708
原创 localForage使用 IndexedDB / WebSQL存储
若浏览器不支持 IndexedDB 或 WebSQL，则使用 localStorage。在所有主流浏览器中都可用：Chrome，Firefox，IE 和 Safari（包括 Safari Mobile）。1，安装和引入2、创建一个 indexedDB3、存储4、取值（由于indexedDB的存取都是异步的，建议使用 promise.then() 或 async/await 去读值）或者 5、删除6、重置数据库 我们使用的时候，就直接调用 store 中
2023-11-28 16:32:06
1269
原创 vue或uniapp使用pdf.js预览
vue或uniapp使用pdf.js预览。一、先下载稳定版的pdf.js，可以去官网下载官网下载地址 或pdf.js包下载(已配置好，无需修改)二、下载好的pdf.js文件放在public下静态文件里，uniapp是放在static下静态文件里
2023-08-09 17:37:05
3445
2
原创 dd.biz.util.downloadFile钉钉下载保存类型为All问题
在钉钉pc端下载使用时发现下载文件类型为All,下载后出现打不开文件问题 （如图）dd.biz.util.downloadFile 官方文档。xxxx.docx 或 xxxx.jpg。带上文件后缀类型后文件类型就正常了。文件名称必须带上文件的类型，
2023-06-07 14:05:04
1381
原创 uniapp引入线上js链接
【代码】uniapp引入线上js链接。由于 uniapp 项目中在 index.html 中使用script标签引入无效
2023-02-09 14:41:44
2245
2
原创 uView组件u-tabs-swiper组件点击滚动无法居中问题
uView组件u-tabs-swiper组件点击滚动无法居中问题。解决方法：找到u-tabs-swiper.vue文件，找到watch监听这里，调换两个方法的执行顺序
2022-12-29 16:29:11
1803
1
原创 uniapp开发H5刷新网页导致本地localStorage数据清空问题
uniapp开发H5刷新网页导致本地localStorage数据清空问题问题描述：使用uniapp开发H5网页时，结合uniapp的本地存储出现刷新时清空本地数据问题。解决方法：使用原生的存储方式localStorage.xxx
2022-12-29 16:12:38
3101
原创 uni.setTabBarBadge 在非 tabbar 页面上更新无效问题
官方建议使用缓存，可以将购物车的有效数量通过 vuex 的 getters 进行实时计算。在每一个 tabbar 页面时都使用 onShow 钩子来将最新的购物车数量更新到 tabbar 角标使用方式
2022-12-20 16:42:08
1870
原创 钉钉扫码登录第三方网站
再根据永久授权码获取用户的钉钉信息......这个code既是临时授权码，根据这个临时码。详见钉钉官方文档 -->让后台接口去获取永久授权码。
2022-12-08 17:35:04
1088
原创 uniapp项目打包H5后 希望可以修改固定的配置（接口地址，系统名称等）
二、在manifest.json 的h5下设置"template" : "template.h5.html" template.h5.html 文件内容，引入配置文件config.js四、重新运行uniapp项目，配置后一定要重启一下五、使用方式在需要的地方直接使用即可vue的配置方式可查看之前写的这篇vue项目打包后 希望可以修改配置（接口地址，系统名称等）项目打包发布，之后可能存在接口域名更换，项目名称修改等情况，就需要开发人员重新修改代码，重新发布，
2022-12-02 09:57:35
5607
2
原创 uniapp开发H5使用formData上传文件
由于uniapp 的 uni.uploadFile 上传的限制，无法实现上传excel、world、ppt等类型的文件，不支持下图的上传方式，故只能调用原生的方法来解决。
2022-11-23 09:58:15
4667
原创 vue自定义组件无法渲染问题（runtime-compiler和runtime-only）
vue自定义组件无法渲染问题（runtime-compiler和runtime-only）
2022-09-27 08:56:09
2462
1
原创 记录el-input使用原生JS事件修改值data后v-model值不同步问题
记录el-input使用原生JS事件修改值data后v-model值不同步问题原因：js修改时没有触发input事件$emit(‘input’,value)这时候问题出现了，v-html的值并没有改变。
2022-08-26 14:06:23
1509
原创 vite之 import.meta.glob批量引入文件
Vite 支持使用特殊的 import.meta.glob 函数从文件系统导入多个模块：打印 metaRouters。
2022-08-12 17:46:15
4138
1
转载 javascript 之实现深拷贝的四种方式
进行深拷贝的方法递归函数 （推荐使用，项目中使用的更多，更小，更安全）JSON.stringify() 和JSON.parse();(不推荐使用,如果遇到Function,Date等类型的变量容易出现一些意料之外的问题)第三方库lodash的cloneDeep()方法 （就情况而定，如果项目中原先就有lodash这个第三方库，可以使用，否则还是推荐使用递归函数。不然成本太高。）JQuery的extend()函数 (推荐在JQuery项目中使用，其他项目依然推荐是用递归函数)...
2022-08-12 16:15:57
593
原创 vue项目打包后 希望可以修改配置（接口地址，系统名称等）
项目打包发布，之后可能存在接口域名更换，项目名称修改等情况，就需要开发人员重新修改代码，重新发布，比较费时费力。希望可以将这些配置在一个文件中，如需更换，运维可直接打开配置文件，更改保存即生效。......
2022-08-09 15:38:32
3511
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人