Hi so i'm relatively new to programming and still learning. so the problem is i have 4 files index.html, index.js, teacher.js, person.js. the teacher module contain class Teacher and the person module contain class Person. when i try to import it to index.js it shows Cannot use import statement outside a module in the browser. can someone help? thanks.

index.js file

import {Teacher} from "./teacher";
const teacher = new Teacher("Mosh", "MSc");
teacher.teach();

person.js file

export class Person {
  constructor(name) {
    this.name = name;
  }

  walk() {
    console.log("walk");
  }
}

teacher.js file

import {Person} from "./person";

export class Teacher extends Person {
  constructor(name, degree) {
    super(name);
    this.degree = degree;
  }
  teach() {
    console.log("teach");
  }
}