自定义useLocalStorage Hook导入报错：模块未提供指定导出名称求助

The requested module '/src/hooks/useLocalStorage.jsx?t=1688798057310' does not provide an export named 'useLocalStorage' (at App.jsx:12:10)

问题出在导出方式和导入方式不匹配：你用默认导出定义了Hook，但导入时用了命名导入的语法。

你的导出代码：

export default function useLocalStorage(key, value) {
  const saveValue = () => {
    localStorage.setItem(key, value)
  }
  return saveValue
}

你的导入代码：

import { useLocalStorage } from './hooks/useLocalStorage'

有两种解决方法，任选其一即可：

方法一：修改导入语句（适配默认导出） #

把命名导入改为默认导入的语法：

import useLocalStorage from './hooks/useLocalStorage'

方法二：修改导出语句（改为命名导出） #

把默认导出改成命名导出，就能保留原来的导入写法：

export function useLocalStorage(key, value) {
  const saveValue = () => {
    localStorage.setItem(key, value)
  }
  return saveValue
}

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