You need to include all of the required scripts, in the correct order, before you can use them. Since
order.js
depends on
product.js
, you need to add:
<script src="baseAddress/product.js"></script>
<script src="baseAddress/order.js"></script>
Alternatively, you can rewrite your scripts as
JavaScript modules[
^], which would allow the scripts to declare their dependencies up-front. But note the limits on cross-browser compatibility mentioned in the MDN article.
product.js:
class Product {
constructor() {
}
getProducts() {
return "all product will retur from here";
}
}
export { Product };
order.js:
import { Product } from "./product.js";
class Order {
constructor() {
}
getOrders() {
return "all data will return from this method";
}
}
export { Order };
main.js:
import { Product } from "./product.js";
import { Order } from "./order.js";
let order = new Order();
let product = new Product();
product.getProducts();
...
HTML file:
<script type="module" src="baseAddress/main.js"></script>