一直以来都觉得typescript是以后前端发展的趋势,一些大厂的前端项目都已经在用ts来替代js了。

正好最近刚开始准备用pixi写个小游戏,因为刚开工没多久,于是今天就将之前的功能用ts去实现了一下,部分功能之前的博客也有提到过。

用的是vue-cli的3.11版本,并且选择了TypeScript,项目初始化后目录如下图所示(红框除外):

单个页面的代码截图如下:

有一点需要注意的是:

@component注解必须加上,无论你是当作路由页面使用还是当作组件使用,不然解析的时候就会有问题(至少生命周期函数不能如期执行),这也是我写的时候踩到的一个坑,其他的都还好,都比较容易上手。

interface.ts

这里定义了业务所需的interface和class,并且export;

到需要使用的页面:

import {task,tasklist,keyboard} from '../tsfile/interface'

这里用ts实现了之前的事件队列模式。

其余的就没什么好说的了,ts的用法和java十分类似,包括继承、构造器、类、接口、泛型等等。。。

哦,对了,这个项目也是直接托管到github的,有空就写一点,地址送上:https://github.com/ecojust/pixi_game

pixi小游戏开发(vue+typescript)的更多相关文章

  1. .Net Core ORM选择之路,哪个才适合你 通用查询类封装之Mongodb篇 Snowflake(雪花算法)的JavaScript实现 【开发记录】如何在B/S项目中使用中国天气的实时天气功能 【开发记录】微信小游戏开发入门——俄罗斯方块

    .Net Core ORM选择之路,哪个才适合你   因为老板的一句话公司项目需要迁移到.Net Core ,但是以前同事用的ORM不支持.Net Core 开发过程也遇到了各种坑,插入条数多了也特别 ...

  2. Egret白鹭H5小游戏开发入门(二)

    前言: 昨天的文章中简单的介绍了Egret白鹭引擎从安装到基本的使用配置等问题,今天着重介绍H5小游戏开发的起步阶段,如Wing面板的使用,素材的处理,类的说明,开始布局等等. 整体概况: 根据上一篇 ...

  3. Egret白鹭H5小游戏开发入门(三)

    前言: 在上一篇文章中着重介绍了H5小游戏开发的起步阶段,如Wing面板的使用,素材的处理,类的说明等等,那么今天主要是涉及到场景的创建,loading的修改等等的代码编写. 对于这一节,我在讲解的过 ...

  4. 一、微信小游戏开发 --- 初次在微信开发者工具里跑Egret小游戏项目

    尝试下Egret的小游戏开发,学习,学习,干IT,不学习,就得落后啊... 相关教程: Egret微信小游戏教程 微信公众平台-微信小游戏教程 微信公众平台-微信小游戏接入指南 开发版本: Egret ...

  5. Egret白鹭H5小游戏开发入门(一)

    前言: 好久没更新博客了,以前很多都不会,所以常常写博客总结,倒是现在有点点经验了就懒了.在过去的几个月里,在canvas游戏框架方面,撸过了CreateJS,玩得了Egret,又学过PIXI.js. ...

  6. 【python游戏编程之旅】第九篇---嗷大喵快跑小游戏开发实例

    本系列博客介绍以python+pygame库进行小游戏的开发.有写的不对之处还望各位海涵. 前几期博客我们一起学习了,pygame中的冲突检测技术以及一些常用的数据结构. 这次我们来一起做一个简单的酷 ...

  7. 【python游戏编程之旅】第五篇---嗷大喵爱吃鱼小游戏开发实例

    本系列博客介绍以python+pygame库进行小游戏的开发.有写的不对之处还望各位海涵. 我们一同在前几期的博客中已经学到了很多pygame的基本知识了,现在该做个小游戏实战一下了. 前几期博客链接 ...

  8. 13、Cocos2dx 3.0三,找一个小游戏开发3.0中间Director :郝梦主,一统江湖

    重开发人员的劳动成果.转载的时候请务必注明出处:http://blog.csdn.net/haomengzhu/article/details/27706967 游戏中的基本元素 在曾经文章中,我们具 ...

  9. 14、Cocos2dx 3.0三,找一个小游戏开发Scene and Layer:游戏梦想

    发人员的劳动成果,转载的时候请务必注明出处:http://blog.csdn.net/haomengzhu/article/details/30474393 Scene :场景 了解了Director ...

随机推荐

  1. Binary Search-使用二叉搜索树

    终于到二叉树了,每次面试时最担心面试官问题这块的算法问题,所以接下来就要好好攻克它~ 关于二叉树的定义网上一大堆,这篇做为二叉树的开端,先了解一下基本概念,直接从网上抄袭: 先了解下树的概念,bala ...

  2. BZOJ 4260: Codechef REBXOR (trie树维护异或最大值)

    题意 分析 将区间异或和转化为前缀异或和.那么[L,R][L,R][L,R]的异或和就等于presum[R] xor presum[L−1]presum[R]\ xor \ presum[L-1]pr ...

  3. Java数据库小项目00---基础知识

    目录 JDBC的简单使用 向JDBC注入攻击 防止注入攻击 自建JDBC工具类 自建工具类优化--使用配置文件 使用数据库连接池优化工具类 JDBC的简单使用 package Test; import ...

  4. Unknown property 'mybatis-plus' yml文件报错

    就是因为没有对应的依赖 package com.taotao.config; import org.mybatis.spring.annotation.MapperScan; import org.s ...

  5. vundle

    vundle插件的使用方法: http://adam8157.info/blog/2011/12/use-vundle-to-manage-vim-plugins http://adam8157.in ...

  6. git避免提交本地配置文件-来自同事的分享

    在项目协作中,对于已经更改的文件,不同的开发者常常需要根据自己的需要对文件进行更改已满足本地开发环境的需求(这种情况很常见,一般是对项目相关的配置项的更改,对业务逻辑代码的更改一般都是正常的协作编码过 ...

  7. kubernetes 之部署metrics-server v0.3.1

    Metrics-server简介 Metrics-server是用来替换heapster获取集群上资源指标数据的,heapster从1.11开始逐渐被废弃了. 在使用heapster时,获取资源指标是 ...

  8. js off动画事件

    每个假期都过得如此快10月一是2017年最后一个假期.不由感叹时间过得真快.我已上个月离职,一直在家休整,今天得空吧前几天学习的知识真理一下. 今天主要整理关于,offset系列的,动画是咱们全都工作 ...

  9. redis的哨兵

    删除旧master或者不可达slave sentinel永远会记录好一个Master的slaves,即使slave已经与组织失联好久了.这是很有用的,因为sentinel集群必须有能力把一个恢复可用的 ...

  10. Linux系统下关闭与启动Oracle11g的顺序与命令

    关闭: 1.关EM:[oracle@localhost ~] emctl stop dbconsole 2.关监听:[oracle@localhost ~] lsnrctl stop 3.关数据库:S ...