Next.js 13教程中Sanity Studio图片裁剪及热点控件无法拖动问题

• 升级Sanity依赖版本
  版本不兼容是常见诱因，先将Sanity核心包及图片相关依赖更新至最新稳定版：

  npm install sanity@latest @sanity/image-url@latest
  # yarn用户执行：yarn add sanity@latest @sanity/image-url@latest
  

  重启Studio后测试控件是否恢复正常。

• 清理浏览器缓存与本地存储
  浏览器缓存或Sanity的本地存储可能引发交互异常：

  • 按F12打开开发者工具，进入「Application」标签
  • 删除「Local Storage」「Session Storage」中所有与你的Sanity项目相关的条目
  • 强制刷新页面（Ctrl+Shift+R / Cmd+Shift+R）

• 排查自定义Schema或插件冲突
  若你自定义了图片类型Schema或安装了第三方插件：

  • 临时注释掉自定义的图片配置，使用默认Schema测试
  • 禁用近期新增的插件，逐个排查是否是插件导致的交互问题

• 更换浏览器测试
  部分旧版或小众浏览器对Sanity Studio的交互支持不足，切换到Chrome、Firefox最新版本尝试。

• 重置Studio配置
  备份当前的sanity.config.ts/js文件，替换为最简配置：

  import {defineConfig} from 'sanity'
  import {deskTool} from 'sanity/desk'
  import {schemaTypes} from './schemas'
  
  export default defineConfig({
    name: 'default',
    title: 'My Studio',
    projectId: '你的项目ID',
    dataset: 'production',
    plugins: [deskTool()],
    schema: {types: schemaTypes},
  })
  

  重启后检查控件拖动功能是否恢复。

内容的提问来源于stack exchange，提问作者Nicolas Domergue