So i am working with html, scss and javascript. But when i try to turn a file into a module and try to import another file, It throws an error
Loading module from “http://localhost:3000” was blocked because of a disallowed MIME type (“text/html”).
Here is my html (imports):
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="./images/core/Favicon.png">
<link rel="stylesheet" href="./CSS/main.css">
<link href='https://unpkg.com/boxicons@2.1.2/css/boxicons.min.css' rel='stylesheet'>
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
<link href="https://www.cssscript.com/wp-includes/css/sticky.css" rel="stylesheet" type="text/css">
<!-- The script imports -->
<script src="./Scripts/animations.js" defer></script>
<!-- The file where i try to import a function from another file -->
<script src="./Scripts/delivery.js" type="module" defer></script>
<title>Home</title>
</head>
Here is the file where I try to import a function (delivery.js):
import { confetti } from './confetti';
confetti();
// ...
Yes, i am exporting a function from confetti.js:
export function confetti() {
// ...
}
Here is my file and folder structure for reference:
Can anyone help.