无法在 Vue 项目中打开本地 .geojson 文件

Question

我正在尝试在我的 VueJS 项目中加载静态 .geojson 文件。简单的 .json 文件正在运行，但是 .geojson 文件给我以下错误：

Uncaught Error: Module parse failed: Unexpected token (1:7)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> {"type": "FeatureCollection", "features": []}
    at eval (address.geojson:1)
    at Object../src/venue/amenity.geojson (app.js:1418)
    at __webpack_require__ (app.js:854)
    at fn (app.js:151)
    at eval (cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Prodmap.vue?vue&type=script&lang=js&:13)

等等.. 当然，我可以将所有文件切换为 .json，但这只能是临时解决方法。

import Address from '@/venue/address.json'; // works
import Address from '@/venue/address.geojson'; // gives me the error

Answer 1

Vue CLI 本机加载 JSON，但我不确定如何为不同的扩展配置它。这是另一个选项：

安装json-loader:

npm install json-loader

在项目根目录的vue.config.js中配置json-loader（必要时创建文件） :

module.exports = {
  configureWebpack: {
    module: {
      rules: [
        {
          test: /\.geojson$/,
          loader: 'json-loader'
        }
      ]
    }
  }
}

无法在 Vue 项目中打开本地 .geojson 文件

Can't open local .geojson files inside Vue Project

javascript

geojson

webpack

vue.js

vue-cli