Vue应用篇—读取本地geojson文件 ( Input data given to 'glasgow' is not a valid GeoJSON object )

在应用mapbox的时候，想要导入自己的geojson文件，一直遇到bug

当前文件路径是：components/map/index.vue, 在这个index.vue文件里我addSource了一个geojson的文件，我确认这个文件的格式是对的，在github上可以正常显示：

并确定这个addSource的格式正确，图是官方案例

但是我自己咋npm run serve之后，但是在它console.log报了一个错：status: 404, url: “http://localhost:8080/glasgow.geojson”, name: “e”, message: “Not Found”

为啥啊？url的路径也没写错啊？各种谷歌与询问朋友之后，终于找到了问题所在。

仔细看报错内容：status: 404, url: “http://localhost:8080/glasgow.geojson”, name: “e”, message: “Not Found”，确认是由于是路径问题，localhost读不出来geojson文件，localhost如此只能将json文件放入public文件夹中，vue-cli 3.0静态文件放在public目录下面，放在public目录下的资源会被直接复制，不会经过webpack的打包处理。所以把geojson文件放在public下面就行了（应该是vue webpack配置的问题）

最终解决方案：