typescript 贪吃蛇 案例

使用TypeScript + Webpack + Less实现贪吃蛇的案例
项目搭建
1、导入配置文件
tsconfig.json
package.json
webpack.config.js
2、项目依赖
TypeScript
（1）typescript
（2）ts-loader
webpark
(1)webpack
(2)webpack-cli
(3)webpack-dev-server
(4)html-webpack-plugin
(5)clean-webpack-plugin
Babel
(1)core-js
(2)babel-loader
(3)@babel/core
(4)@babel/preset-env
Less & CSS资源
(1)style-loader
(2)css-loader
(3)less
(4)less-loader
(5)postcss
(6)postcss-loader
(7)postcss-preset-env
项目要点
面向对象编程
获得食物坐标
食物自动刷新
范围控制
分数、等级限制（等级随着分数增加而增加，同时蛇的速度也会得到提升）
侦听键盘事件
蛇头移动
蛇头吃食检测
蛇身增加
蛇身跟随移动
蛇头撞墙检测
蛇头撞身体检测

项目地址