Error With Parsing JSON

[SalladShooter]

Question:
So, I am making a Trivia App that you will be able to make your own question sets in HTML/CSS/JS, I am planning on putting my question set data into a JSON file, but when I try and fetch and parse the data in my JavaScript file it throws this error →

Error: Cannot parse given Error objecthttps://eed202be-ef54-466b-9406-bb5c50e27923-00-34vd7zc7djfyh.spock.replit.dev/__replco/static/devtools/devtools.js:57 

Repl link:
https://replit.com/@SalladShooter/TriviaApp?v=1

script.js

import data from './question_sets.json';

const question_sets = data;

let answer;

function set_question() {
    
    let random = Math.floor(Math.random() * question_sets.planetary_set.length);
    let question = question_sets.planetary_set[random].question;
    answer = question_sets.planetary_set[random].answer;
    let icon = question_sets.planetary_set[random].icon;
    let type = question_sets.planetary_set[random].type;

    document.getElementById("icon").setAttribute("name", icon);
    document.getElementById("icon").setAttribute("type", type);
    document.getElementById("question").innerHTML = question;
    
}

set_question();

let modal = document.getElementById("question-modal");

let modal_text = document.getElementById("modal-text");

document.querySelector('.q-a-wrapper').addEventListener('submit', function(event) {
    event.preventDefault();

    let answer_input = document.getElementById("answer-input");
    let answer_value = answer_input.value.toLowerCase();

    if (answer_value) { 
        modal.style.opacity = "1";
        if (answer_value === answer.toLowerCase()) {
            modal_text.innerHTML = "Correct";
            modal_text.style.color = "var(--back)";
            modal.style.background = "var(--primary)";
        } else {
            modal_text.innerHTML = "Incorrect";
            modal_text.style.color = "var(--fore)";
            modal.style.background = "var(--back)";
        }
        answer_input.value = '';

        modal.classList.add("active");

        setTimeout(function() {
            modal.style.opacity = "0";
            setTimeout(function() {
                modal.classList.remove("active");
            }, 300);
        }, 2000);

        set_question();
    }
}); 

question_sets.json

{
    "planetary_set": [
        {
            "question":"What is the 1st planet from the Sun?",
            "answer":"mercury",
            "icon":"planet",
            "type":""
        },
        
        {
            "question":"What is the most common element in the universe?",
            "answer":"hydrogen",
            "icon":"planet",
            "type":""
        },
        
        {
            "question":"What unkown force is causing the universe to expand?",
            "answer":"dark energy",
            "icon":"planet",
            "type":""
        }
    ]
} 

[Firepup650]

Tbh that looks kinda like it’s just the devtools wrapper being a pain…

@SalladShooter

cannot parse given Error

Does it work in a new tab? If not, it should at least provide a more helpful error.

[SalladShooter]

@Firepup650

Does it work in a new tab? If not, it should at least provide a more helpful error.

No it doesn’t. I wonder what it is then, I am new to JS so I might have just done some small mistake to cause it.

[Firepup650]

Does it still throw the same error?

[Firepup650]

Also wait, I get an entirely different error from your code…

[SalladShooter]

@Firepup650 the error stopped after I put changed the <script> tag to <script type="module" src="script.js"></script> .