使用Webpack Dev Server时history模块报错求助

错误原因 #

你遇到的警告是因为history库版本变更导致的导入方式不匹配：在history v5及后续版本中，createBrowserHistory不再是命名导出，而是作为默认导出存在，你的代码使用了解构导入的方式，因此Webpack无法找到该导出项。

解决方案 #

方案一：修改导入方式适配当前history版本

直接将history.js中的解构导入改为默认导入即可：

import createBrowserHistory from "history";

export default createBrowserHistory({ forceRefresh: true });

方案二：降级history版本以保留原有写法

如果你需要继续使用命名导入的语法，可以将history降级到v4版本：

npm install history@4.x --save

或者使用yarn：

yarn add history@4.x

补充说明 #

react-router-dom v6本身内置了history相关功能，若你仅需自定义history实例配合HistoryRouter使用，方案一的修改即可解决问题，无需额外降级版本。

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