Problems to import json with VueJs

Question

So, I'm trying to import a json file to be able to set some params in my application. The code I'm using to import my json is:

import json from './json/config.json'
export default {
    data() {
        return {
            URL_FILE_IMPORT: json.fileImport,
        }
    }
}

... and my is very simple so far: 到目前为止非常简单：

{
    "fileImport": "<my_url_goes_here>",
}

The problem is that I'm facing this error:

ERROR  Failed to compile with 1 errors


This relative module was not found:

* ./json/config.json in ./src/services/config.js

But I have access to the file, if I click in the ./json/config.json path.

I've seen that there are some differences between some vue.js versions about the json configuration. I'm not 100% sure how to see the version I'm using, but my @vue/cli-service is version 4.2.2. Does anyone knows how to solve it?

---

So, I've found my solution. It was very simple, I just needed to use

const jsonData = require('../json/config.json');

... and with this I can access jsonData.fileImport

Answer 1

Маке sure the path is correct, if you make import in file ./src/services/config.js with path "./json/data.json" it will look for json in ./src/services/json. Where exactly is your folder /json, if it is in src folder then import should be "../json/data.json". Usually there is alias in web-pack "@" which is to "/src", then import will be "@/json/config.json"