安装react-google-maps遇npm ERR! ERESOLVE依赖树解析错误求助

先恢复被--force搞坏的项目 #

• 删除项目根目录下的node_modules文件夹
• 删除package-lock.json（使用yarn则删除yarn.lock）
• 执行npm install（或yarn install），恢复原有依赖的正常状态

解决地图组件安装的两种方案 #

方案一：使用官方维护的替代包（强烈推荐）

react-google-maps@9.4.5是2019年的停止维护版本，仅支持React 15/16，和React 18完全不兼容。推荐使用官方维护的@react-google-maps/api，它完美支持React 18，用法和旧包基本一致：

1. 安装命令：

npm install @react-google-maps/api

2. 基础使用示例：

import { GoogleMap, Marker } from '@react-google-maps/api';

export default function MyMap() {
  return (
    <GoogleMap
      mapContainerStyle={{ width: '100%', height: '400px' }}
      center={{ lat: 39.9042, lng: 116.4074 }}
      zoom={10}
    >
      <Marker position={{ lat: 39.9042, lng: 116.4074 }} />
    </GoogleMap>
  );
}

方案二：强行安装旧包（仅临时应急，不推荐）

如果必须使用旧版react-google-maps，不要用--force（会强制覆盖依赖导致项目损坏），改用--legacy-peer-deps参数忽略peer依赖冲突：

npm install react-google-maps --legacy-peer-deps

⚠️ 注意：这种方式可能引发运行时未知bug，因为旧包未适配React 18的API和生命周期变化，长期使用不建议。

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