Vue2集成Leaflet加载Mapbox瓦片报无法读取null的lat属性错误

核心问题是地图中心点坐标格式写错了：
你在data里定义的center: [37,7749, -122,4194]误将经纬度的小数点写成了逗号，整个数组变成了4个独立数值，不符合Leaflet要求的[纬度, 经度]二元经纬度格式。Leaflet在setView时解析不到合法的坐标对象，尝试读取null值的lat属性就触发了报错。

• 修正center坐标的写法，把误写的逗号换回小数点，正确代码如下：

data() {
  return{
    center: [37.7749, -122.4194]
  }
}

• 确认本地存放Mapbox访问令牌的token.js文件路径正确，令牌值填写有效，保存后重新运行项目即可正常加载地图瓦片。

如果后续运行时出现地图标记图标错位、资源404的问题，可以在导入Leaflet的代码块下补充默认图标路径配置，修复构建工具的资源路径解析问题：

import L from "leaflet";
delete L.Icon.Default.prototype._getIconUrl;
L.Icon.Default.mergeOptions({
  iconRetinaUrl: require('leaflet/dist/images/marker-icon-2x.png'),
  iconUrl: require('leaflet/dist/images/marker-icon.png'),
  shadowUrl: require('leaflet/dist/images/marker-shadow.png')
});

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