Posts

有时你从浏览器下载一个 .app（或从压缩包/DMG 拖出来），双击打开时 macOS 会弹窗： “xxx 已损坏，无法打开。你应该将它移到废纸篓。” 这个弹窗经常不是“文件真的坏了”，而是 Gatekeeper 把这个 App 标记成了“来自互联网下载”，然后直接拦截（常见触发点就是 com.apple.quarantine 这个扩展属性）。 下面给一个“按步骤走就行”的通用处理流程（更贴近这个弹窗本身）。 推荐流程（按顺序来） 1) 确认 App 在 /Applications（可选，但建议） 把应用拖到「应用程序（/Applications）」再试一次打开，避免路径/权限带来的额外干扰。 如果还是弹“已损坏”，继续下一步。 2) 移除 quarantine（核心步骤） 如果你确认应用来源可信（例如 GitHub Releases / 自己构建 / 可信网站下载），接下来的操作就可以移除它的 quarantine 标记（以解决「已损坏」提示）。 sudo xattr -dr com.apple.quarantine 全选上面的命令，复制后粘贴到你的终端 然后在 com.apple.quarantine 后面加上你的 App 路径(直接把你的 App 拖到终端就会自动粘贴路径)。输入后的示例如下👇👇👇 sudo xattr -dr com.apple.quarantine "/Applications/导出微信表情包.app" 执行时系统可能会弹出 sudo 授权（输入密码/Touch ID 允许即可）： 如果你的 App 不在 应用程序(Applications) 目录下，把 .app 直接拖进 Terminal 会自动粘贴路径（再在前面补上 sudo xattr -dr com.apple.quarantine 回车即可）。 ...

很多人都有同一个烦恼：微信里收藏了一堆顺手的表情包，但到了飞书/企微/钉钉这些工作 IM 里就用不上了。手动一张张保存太折磨，截图又糊。 所以我做了个小工具：export-wechat-emoji，目标就是一键把微信收藏表情包导出来（方便用于导入飞书/企微/钉钉等平台进行斗图！）。 它能干嘛 自动找到 macOS 上微信的数据目录，支持多微信账号选择/切换 解析微信的收藏表情包数据（Stickers/fav.archive），把表情包的图片链接扒出来 一键批量下载到本地，并按「每 50 张」分文件夹进行保存（因为很多平台一次最多导入表情包数量为 50 张） 怎么用（大概三步） 免费下载 最新版本客户端（macOS） 打开软件，选择要导出的微信目录（电脑登录过多个微信的话这里会有好几个） 点导出，然后去导出目录里按文件夹分批导入到飞书/企微/钉钉 图文演示（4 步） 进入客户端 选择目标微信文件夹（电脑可能登录过多个微信，所以需要选对目录） 预览表情包确认选对了；不对就切换文件夹再预览 点击“导出”开始导出，中途可以取消；导出完点“打开下载目录”就能看到全部表情包（按 50 张分组） 注意事项 目前主要支持 macOS（我自己日常用的环境） 需要你电脑上装了微信客户端，并且登录过、收藏里确实有表情包 微信客户端升级后数据结构可能会变；如果导出失败，欢迎提 Issue：https://github.com/liusheng22/export-wechat-emoji/issues 你可能关心的问题 Q：这个安装包会不会很大？ 目前安装包大概 3.5MB 左右（Tauri + Rust），体积很小。 Q：是否存在隐私安全问题？ 全程本地处理，不会把任何东西上传到服务器。 Q：安装后提示「xxx 已损坏，无法打开。你应该将它移到废纸篓。」怎么办？ 这是 macOS 常见的“来源限制/隔离属性”拦截，按这篇做就行：/posts/macos-app-is-damaged-fix/ Q：使用过程中提示了 2～3 次文件授权，是否可信？ 正常的文件权限授权（读取微信数据目录、选择导出目录等），点“允许”即可；不会额外拿到不相关的权限。 Q：为什么预览表情包时，有些图片无法显示？ 部分资源不是 gif（可能是 jpg/png/webp），工具会做自动后缀 fallback；但仍可能遇到 URL 过期/风控导致的加载失败。 Q：为什么导出后的表情包要按每 50 张分组？ 因为像飞书这类平台，单次添加自定义表情包通常最多选 50 张图；提前分好组更省事。

适用对象：用 Capacitor 把 React SPA 打包成 iOS App，二级页面希望支持系统左侧边缘右滑返回（交互式侧滑返回手势）。 问题背景 在 WKWebView（Capacitor iOS 容器）里跑 React Router 这类 SPA，经常会遇到： 二级页面无法侧滑返回； 能侧滑但上级页面预览是白屏/黑屏（看不到上一页内容）； 自己实现手势（截图 + 叠层 + history.back()）会引入大量时序/兼容性坑。 结论：优先用系统能力，而不是自研手势 核心思路：让 WebView 直接启用 WebKit 自带的交互式返回手势。 在 iOS 上，这个开关就是： webView.allowsBackForwardNavigationGestures = true 这比“自研 edge-pan + snapshot”可靠得多：交互曲线、阈值、上一页预览快照、渲染时机都由系统处理。 最小可用改动（3 步） 下面这 3 步就是能通过验收的关键（其余优化都可以后放）。 1) 用自定义 CAPBridgeViewController 子类接管 WKWebView 配置 文件：ios/App/App/AppDelegate.swift 新增 AppViewController: CAPBridgeViewController 在 viewDidLoad() 里统一设置背景色（减少“闪白/闪黑”），并启用系统手势 @objc(AppViewController) class AppViewController: CAPBridgeViewController { override func viewDidLoad() { super.viewDidLoad() self.view.backgroundColor = UIColor.systemBackground self.webView?.isOpaque = true self.webView?.backgroundColor = UIColor.systemBackground self.webView?.scrollView.backgroundColor = UIColor.systemBackground self.webView?.allowsBackForwardNavigationGestures = true } } 2) storyboard 把初始 VC 指向你的自定义 VC 文件：ios/App/App/Base.lproj/Main.storyboard ...

🤡 什么是 Nonsense UI？ Nonsense UI 是一个专注于制造交互障碍的 Vue 3 荒诞组件实验室。它的核心理念是：拒绝用户体验，挑战直觉极限，提供反人类、反直觉的荒诞交互。 Nonsense UI 组件库主页 - 一个专注于制造交互障碍的荒诞组件实验室 您的浏览器不支持视频播放，请访问 官方文档 在线体验。 点击播放，体验 Nonsense UI 的荒诞交互效果 🎯 项目背景 Nonsense UI 是一个纯粹的娱乐项目，没有任何实际用途。它的存在就是为了整蛊和娱乐，让用户在尝试使用时感到困惑和挫败。 ✨ 核心特性 极致挫败：每一处交互都经过反直觉设计，确保用户在点击时产生怀疑 严谨乱来：交互很荒诞，但代码很严肃，全量 TypeScript 支持，工程化发布 毫无用处：这里没有任何能提升生产力的工具，纯粹为了娱乐 🔗 相关链接 🌐 官方文档： 在线体验 📦 NPM 包： 并不推荐安装的npm包，仅用于娱乐 💻 GitHub： 欢迎 Star 和 Fork，欢迎提 issue 👤 作者： @liusheng22 📝 更多项目： 我的项目列表 如果你对这个荒诞的组件库感兴趣，欢迎访问 Nonsense UI 组件库 来体验一下反人类 UI 设计吧！😄

qqmap-uniapp：腾讯地图SDK的现代化解决方案 基于腾讯官方微信小程序JavaScript SDK v1.2，专为现代化开发环境打造的ES模块版本 背景：为什么需要这个包？ 在开发基于 Vue3 + Vite 的 uni-app 项目时，笔者遇到了两个关键问题： 问题1：模块格式不兼容 腾讯官方提供的 qqmap-wx-jssdk.min.js 是一个 CommonJS 格式的文件，而现代构建工具如 Vite、Webpack 5+ 默认使用 ES Module（ESM） 格式。 // ❌ 官方SDK使用CommonJS格式 var QQMapWX = require('qqmap-wx-jssdk.min.js'); // ✅ Vue3 + Vite需要ESM格式 import QQMapWX from 'qqmap-uniapp'; 问题表现： Vite 无法正确解析 module.exports，导致导入失败 编译错误：require is not defined or ReferenceError: Can't find variable: require __ERROR 问题2：平台限制过于严格 官方SDK只支持微信小程序环境，使用了 wx.request 进行网络请求，这限制了其在其他平台的使用： // 官方SDK中只使用wx.request wx.request({ url: 'https://apis.map.qq.com/ws/...', success: function(res) { /* ... */ } }); 在 uni-app 跨平台开发中，我们需要使用 uni.request 来实现一套代码多端运行。 问题表现： ...

欢迎来到我的个人网站！ 这是我的第一篇文章，使用 Hugo 和 PaperMod 主题构建。 我会在这里分享技术文章、项目经验和一些思考。 敬请期待更多内容！