我正在学习一个简单的在线教程。没有什么花哨的事情发生，我没有使用 Node 或 React。这家伙正在使用 Sandbox，但我只是使用 Brackets 和桌面上的文件夹来包含我的文件。一切都很好，直到我必须将一个类从一个脚本 ( paddle.js )导出到主脚本 ( index.js )。在更改第一行之前，正如预期的那样，我在浏览器中只有一个空白画布。更改第一行（分别通过插入导出/导入命令）后，我在 Chrome 中收到以下错误：未捕获的语法错误：意外的标识符 index.js:1未捕获的语法错误：意外的令牌导出 paddle.js:1这是我的脚本 paddle.js：export default class Paddle { constructor(gameWidth, gameHeight){ this.width = 150; this.height = 30; this.position = { x: (gameWidth - this.width) / 2, y: gameHeight - this.height - 10, }; } draw(ctx){ ctx.fillRect(this.position.x,this.position.y,this.width,this.height); }}这是我的脚本 index.js：import Paddle from 'paddle';let canvas = document.getElementById("gameScreen");let ctx = canvas.getContext('2d');const GAME_WIDTH = 800;const GAME_HEIGHT = 600;ctx.clearRect(0,0, GAME_WIDTH,GAME_HEIGHT) //clears region between corners of screen, necessary fro re-drawing because screen does not 'reset' until I tell it to.let paddle = new Paddle(GAME_WIDTH, GAME_HEIGHT);paddle.draw(ctx);这是我的 html 文件 index.html（主要是样板文件）：<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> #gameScreen{ border: 1px solid black; } </style> <title>breakout tutorial</title></head><body> <canvas id = "gameScreen" width="800" height="600"></canvas> <script src = "index.js"></script> <script src = "paddle.js"></script></body></html>我应该在屏幕底部得到一个蓝色的桨，就像这个人的视频一样：https://www.youtube.com/watch?v=3EMxBkqC4z0
2 回答
眼眸繁星
TA贡献1873条经验 获得超9个赞
在本教程中，这家伙使用的 IDE 可能位于浏览器中，也可能通过一些花哨的文件管理。他需要使用导入/导出。我不需要这样做，因为我的所有脚本都在同一个目录中。所以我去掉了那些导入/导出命令。我DID需要做的是加载“桨”类到HTML文件中领先于其他.js文件的（index.js）使用它（废话，我装它们以相反的顺序）。当我这样做时，我得到了这个：
现在，我知道这个解决方案在堆栈溢出时很常见，所以我想说我非常感谢每个有经验的人阅读我们的鸡爪并说“嗯，打赌你忘记了'x，y，z'！” . 随着我的不断成长，我将期待解决此类导入/导出命令问题的方法。
添加回答
举报
0/150
提交
取消