mac 外接磁盘,热更新失效

背景

外接磁盘剩余内存比较大,想空出一些内存给内置磁盘,于是,移动了项目。跑项目发现热更失效。

根本原因

Mac 前端工具(Vite或者Webpack)默认是依靠 FSEvents 系统原生事件监听文件的修改的。

外接的 移动硬盘 或者 固态U盘 属于外部挂载文件系统,存在下面两个问题:

  • FSEvents事件丢失、延迟:外置磁盘的文件写入事件无法完整、实时传递给 Node 的 chokidar监听器,保存代码后工具完全收不到变更通知,自然不触发热编译 HMR。

  • IDE安全写入冲突:VSCode、WebStorm 默认安全写入机制(临时文件替换)在外置盘会拆分文件事件,监听器识别不到有效修改。

当然还有额外干扰:移动硬盘闲置休眠、usb读写延迟、外置盘ntfs第三方挂载驱动不稳定,进一步加剧监听失效。

解决

如果并不想从外置又移动到内置内存当中,那么考虑一下试试下面方案。

方案1:

vite 项目(Vue、React,90%前端项目在用)

vite.config.js/ts, 强制轮询扫描文件,放弃 mac 衍生 FSEvents 监听:

js 复制代码
export default defineConfig({
  plugins: [vue()],
  server: {
      hmr: true, // 确保热更开启
      watch: {
        usePolling: true, // 外置磁盘必开,轮询替代系统事件
        interval: 150, // 扫描间隔(ms),数值越小越灵敏
        binaryInterval: 300,
        ignored: ['**/node_modules/**', '**/dist/**'] // 减少监听压力
      }
  }
})

修改后重启dev服务,保存代码即可正常热更。

方案2: Webpack项目(Vue2 / React)

webpack-dev-server配置开启轮询:

js 复制代码
devServer: {
  hot: true,
  watchOptions: {
    poll: 150, // 开启轮询
    ignored: /node_modules/
  }
}

另一种就是从外置内存转内置内存

转了就可以了。

相关推荐
北斗落凡尘25 分钟前
LangGraph 入门实战(7)
后端·langchain
uzong40 分钟前
业务新老系统数据迁移-负责人经验总结和复盘
后端
ZJU_统一阿萨姆1 小时前
【DSH】如何将 DeepSeek Harness 嵌入生产环境?万字解构 DeepSeek Agent Harness 的运行机制与安全边界
前端·javascript·安全
用户921080262861 小时前
4. 前端地图大量点位实时更新优化:后端推增量,前端做 diff
前端
dogstarhuang1 小时前
大模型 API 停服怎么办:用 API 网关实现多模型统一接入与可切换架构
人工智能·后端·架构·大模型·api·数字化转型·ai应用
SoaringHeart1 小时前
Flutter最佳实践:Web项目中文字体首次加载乱码问题解决
前端·flutter
程序猿DD1 小时前
OctaFuse Gateway 2.5.0:接入 Responses 端点、更易理解的路由配置
后端·agent
西安小哥2 小时前
破局与重生:大厂前端如何借力 AI 转型“超级全栈“
前端·人工智能
sunly_2 小时前
TypeScript总结:16、面向对象速查
前端·javascript·typescript
MXN_小南学前端2 小时前
React超长文本域中实现“返回顶部”浮动按钮
前端·javascript·react.js