介绍

在上一篇博客文章中，您在FourInARowGame中检查了胜利和抽奖。

现在，您将重组您到目前为止所做的工作，以准备您将为游戏创建的HTML5帆布前端。

创建游戏逻辑目录

首先，在称为gameLogic的src目录中创建一个新目录。

现在将src/constants目录和src/FourInARowGame.js移至src/gameLogic。

最后，在src/gameLogic下创建一个名为index.js的文件，带有以下内容：

import FourInARowGame from "./FourInARowGame.js";
import * as Constants from "./constants/index.js";

export { Constants, FourInARowGame };

从现在开始，核心游戏逻辑将存储在src/gameLogic中并引用。 src/gameLogic的外部将用于前端。

从游戏逻辑模块导入

您现在正在将核心游戏逻辑导出为src/gameLogic/index.js的模块。现在，您需要修复FourInARowGame类的过时导入。

import { FourInARowGame } from "./gameLogic/index.js";

window.fourInARowGame = new FourInARowGame();

如果您在Web浏览器的控制台中测试代码，则仍然应该像以前一样与window.fourInARowGame进行交互。

如果没有，请确保您正确地遵循了本文中的说明！

太好了！现在，您准备开始在下一篇文章中开始在前端工作。