Issue
I am currently building a quiz in plain JS. I have my questions js file separate to my script.js file. I am trying to import the questions from questions.js into the script.js file but get a error of:
GET http://127.0.0.1:5500/JS/questions net::ERR_ABORTED 404 (Not Found)
In my HTML file I have a script like so:
<script type="module" src="./JS/script.js"></script>
What do i need to do to import the questions from question.js file into the script.js file? I have been looking on youtube and stackoverflow but cant seem to find anything that works for me...
Thanks
Solution
If you are useing ES6 modules with type="module" attribute in your script tag, you need to specify the correct path to your module files. Ensure that the paths are correct and relative to the HTML file.
Here's a basic example structure:
Folder Structure:
- index.html
- JS/
- script.js
- questions.js
HTML File:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Your Quiz App</title>
</head>
<body>
<!-- Your HTML content goes here -->
<script type="module" src="./JS/script.js"></script>
</body>
</html>
Questions File:
// questions.js
const questions = [
{ question: "What is your question?", answer: "Your answer" },
];
export default questions;
Script File:
import questions from './questions.js';
console.log(questions);
Make sure that the paths in the import statements are correct relative to the HTML file. If your project structure is different, adjust the paths accordingly.
After making these changes, you should not encounter the "404 Not Found" error for the questions.js file. Ensure that there are no typos in the file names or paths.
Answered By - faghihy
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.