Question

我正在重构我的JavaScript代码，使其更加面向对象，但是我无法获得将类应用到工作的最新功能！

首先，我在一个单独的文件中声明该类，如下所示：

// models/player.js 
export default class Player {

   constructor() {
      //loads of code
   }
}

然后，我在html中引用该文件，如下所示：

<script src="js/models/player.js" type="module"></script>
<script src="js/game.js" type="text/javascript"></script>

最后，我尝试将类导入这样的主js文件中：

// game.js
import Player from './models/player';

但是由于某种原因，Chrome（甚至是Canary）在第一行导入行中就抛出了“ Uncaught SyntaxError：Unexpected Identifier”！

我正在尝试遵循我可以在网上找到的所有规格和示例。我想念什么？

Answer 1

导入和导出只适合在模块系统中使用，例如使用webpack等。但是当您直接插入脚本文件时，则不需要它：

// models/player.js 
class Player {

   constructor() {
      //loads of code
   }
}

<script src="js/models/player.js" type="text/javascript"></script>
<script src="js/game.js" type="text/javascript"></script>

现在，您可以直接使用该类：（在game.js中）

new Player

如果即使在插入脚本时也喜欢使用import export，则必须将其类型指定为模块：

<script src="js/models/player.js" type="module"></script>
<script src="js/game.js" type="module"></script>

文件中的Javascript导入类产生“未捕获的SyntaxError：意外的标识符”

1 个答案: