Question

我不确定我在做什么错。我不断收到404消息。这是我的代码。

index.html：

<html>
  <head>
    <title>Drones</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>

app.js：

import {Car} from './car.js';
import {Drone} from './drones.js';

let c = new Car();
let d = new Drone();

console.log(c);
console.log(d);

Vehicle.js

export class Vehicle {


}

drones.js

import Vehicle from 'vehicle.js';

export class Drone extends Vehicle {

}

car.js

import {Vehicle} from 'vehicle.js';

export class Car extends Vehicle {

}

404 message I keep getting

Answer 1

在html中用<script type=“module“ src=“src/app.js“></script>导入app.js并确保声明您导入的js文件的相对路径

Answer 2

根据您的评论，如果目录car.js的子目录中的drones.js和app.js驻留在其中，则您需要将导入内容更改为：

// use relative pathing
import {Car} from './classes/car.js';
import {Drone} from './classes/drones.js';

或：

// use absolute pathing
import {Car} from 'src/classes/car.js';
import {Drone} from 'src/classes/drones.js';

这是因为路径的./部分指向引用文件所在的目录（即./中的src/app.js指向src/。

将对象页面绑定到HTML

2 个答案: