使用WebAssembly -PWA准备将Pygames部署到GitHub页面上!
#javascript #python #github #githubhack23

我是这个黑客马拉松的晚期来!

我建造的

github动作以pygames构建的任何游戏构建到github页面 - 移动友好和pwa word go!

Game Logo

图像信条:Wikimedia

类别提交:

电话友好

ð - �ð»对于那些说的人,我只是想看它,Link4

ð¬对于那些说话足够说话的人-YouTube Demo Link

对于那些说,显示您建造的内容的人-GitHub Repo Link

屏幕截图

主屏幕

Game Home

支持所有具有WebAssemly支持的浏览器的设备类型(大多数现代浏览器都可以)!

测试的设备

  • 宏监视器34“
  • Hp Omen 15"
  • Microsoft Surface GO 2 10“
  • 三星智能手机6“

All screen sizes

github动作

GitHub Actions

游戏玩法

移动的

Mobile Gameplay

PWA

Landscape

Portrait

个人电脑

PC Gameplay

描述

复制了1978年的传奇街机太空入侵者,这是Tomohiro Nishikado开发的一款拍摄的街机游戏。

可以通过支持WebAssembly的任何Web浏览器进行游戏。

命令使用

  • 左箭头 - 将船向左移动
  • 右箭头 - 将船向右移动
  • 空间 - 拍摄一次镜头

难以提高难度级别的难度_level变量,值在1到10之间,在船上发射的敌人子弹数量。

尝试整合一次特殊的命令快速射击,该快速射击敌人100次连续射击 - 无逃脱这次攻击。

GitHub源代码链接

https://github.com/Santhoshkumard11/deploy-pygame

deplation-pygame.yml

替换/space_invaders/用游戏名称中的存储库中的路径

name: Build Space Invaders with Pygbag
on:
  push:
    branches:
      - main
  workflow_dispatch:

jobs:
  build-pygbag:
    name: Sandy Inspires - Space Invaders Game
    runs-on: ubuntu-latest

    steps:
    - uses: actions/checkout@v2
    - name: Checkout
      run: |
            echo "Attempting to install pygbag"
            python -m pip install pygbag
            echo "Successfully installed pygbag"
            echo "Attempting to build the game"
            python -m pygbag --build $GITHUB_WORKSPACE/space_invaders/main.py
            echo "Successfully build the game and complied to WebAssembly"

    - name : "Upload to GitHub pages branch gh-pages"
      uses: JamesIves/github-pages-deploy-action@4.1.7
      with:
        branch: gh-pages
        folder: space_invaders/build/web

允许许可证

MIT许可证

常见错误

分享我犯的一些错误并找到了解决方案。

1)设置工作流权限正确

  • 要为您的存储库(创建分支或推动代码)写入读写权限。 脚步: 1)转到您的回购设置 2)单击左侧侧边栏上的操作**选项卡 3)单击**一般 4)一直向下滚动以查找 WorkFlow权限,检查和写入权限,然后单击“保存”。

2)使用 $ github_workspace 变量,如果您不确定从哪里获取文件或文件夹的位置。

随着我遇到更多的更多内容,将来会增加更多。

背景

我一直想制作游戏,但对游戏设计一无所知,但是我对Python脚本和数据库非常好。最近,我有点重新设计了太空入侵者ð§`d-并在线发布,但是许多人说他们想尝试一下,所以我要求他们按照readme.md文件中的说明进行操作。尽管如此,许多人还是很难做到这一点,因此我想将其部署在网络中,因此对于想要播放并提供反馈的任何人来说,它都可以访问。我看到了这个黑客马拉松,并在想是否可以通过github动作部署它。令我惊讶的是,有一种简单的部署方式来构建和部署游戏-Github页面进行了救援。

我如何建造它

对于不想进入复杂的詹金斯管道,部署和管理物品的开发人员来说,

github动作一直是CI/CD。但是谁需要一个简单的CI/CD,每次都可以使用。我已经使用GitHub操作来部署Azure功能,应用程序服务和其他Azure服务,但是这次我想进一步简化该过程。我想写下自己的流程,所以我只是尝试了一个,它奏效了 - 就像魔术一样。您真的不知道发生了什么,但是它部署了,而且它只是有效的。

我对GitHub页面的工作方式有一个清晰的了解,但没有经常探索它,但是现在,由于我想将游戏部署为Web应用程序,所以我一直在寻找GitHub页面,看看它是否可以支持要部署的游戏,而不仅仅是一个简单的Web应用程序。

再次感到惊讶,只要您有一个index.html文件,其中包含所有代码,就可以向其部署Web应用程序(不用于生产)。最初,我必须将其部署到Azure函数,这很好,我要去部署API和简单的Web应用程序,但是我一直想简化事物。

我不认为它会起作用,但是它确实如此,我将python脚本符合了webAssembly,并创建了一个index.html,我将其推到 gh> gh pages branch ,然后能够顺利进行游戏并进行游戏玩法 - 没有滞后(良好的FPS),只有在加载游戏时才慢。

使用以下资源来构建这个

pygame -Link
WebAssembly -Link
pygbag -Link