I have a problem and it is that using the library es6-module-loader-dev
is giving me an error when getting the classes that I am importing. Initially, I thought it was the route, but after verifying them, seeing if the classes had the export and if everything was in the indicated routes, it keeps giving me the error.
My code is the following:
Vehicle Class:
export default class vehicle {
constructor(){
}
}
Class Cars and drones:
import Vehicle from './vehicle';
export class Car extends Vehicle {
constructor(){
super();
}
}
import {Vehicle} from './vehicle';
export default class Drone extends Vehicle {
constructor(){
super();
}
}
Main class:
import {Car} from './classes/car';
import {Drone} from './classes/drone';
Index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="node_modules/traceur/bin/traceur.js"></script>
<script src="node_modules/es6-module-loader/dist/es6-module-loader-dev.js"></script>
</head>
<body>
<script>
System.import('src/app.js');
</script>
</body>
</html>
Project structure:
The Error that shows me in the browser is:
es6-module-loader-dev.src.js:1478 Uncaught (in promise) Error: Error loading http://localhost:3000/src/classes/car as "./classes/car" from http://localhost:3000/src/app.js XHR error (404 Not Found) loading http://localhost:3000/src/classes/car
at f (es6-module-loader-dev.src.js:1478)
at XMLHttpRequest.g.onreadystatechange (es6-module-loader-dev.src.js:1499)
The module
es6-module-loader
requires the modules suffix (.js
) to be specified otherwise it will display a 404.