当前位置: 首页 > news >正文

第2讲:pixi.js 绘制HelloWorld

基于第0讲和第1讲,我们增添了vite.config.ts文件。并配置了其他的http端口。
此时,我们删除掉没用的东西。
删除 conter.ts、typescript.svg

在main.ts中改成如下内容:

import {Application, Text} from 'pixi.js'
import './style.css'// 指明Application的类型是一个HTML的Canvas, 也就是HTMLCanvasElement
let app = new Application<HTMLCanvasElement>();
document.body.appendChild(app.view)let text = new Text('Hello World', {fill: 0x00FF00
});app.stage.addChild(text);

在style.css中,删除所有代码,并且添加如下代码:

body{margin: 0
}

然后在package.json中点击Debug,启动了localhost:7777
这是我的vite.config.ts配置:

import { defineConfig } from 'vite';export default defineConfig({server: {port: 7777,host: '0.0.0.0'},
});

最后在浏览器中查看:
在这里插入图片描述

http://www.lryc.cn/news/375221.html

相关文章:

  • golang HTTP2 https测试POST变GET问题小记
  • Linux下的lvm镜像与快照
  • 嵌入式linux系统中SPI子系统原理分析01
  • Part 4.2 背包动态规划
  • Elasticsearch-使用Logstash同步Mysql
  • 6.17作业
  • 算法思想个人总结(结合生活理解)
  • openh264 帧间预测编码过程源码分析
  • Linux网络 - HTTP协议
  • 面试题——Nginx
  • 持续学习的综述: 理论、方法与应用
  • 跨域资源共享(CORS)问题与解决方案
  • 实用软件分享-----一款免费的人工智能替换face的神器
  • 不可思议!这款 Python 库竟然能自动生成GUI界面:MagicGUI
  • 论文发表CN期刊《高考》是什么级别的刊物?
  • 离散数学复习
  • 华为网络设备高频命令
  • 信友队:南风的收集
  • 找工作小项目:day16-重构核心库、使用智能指针(3)
  • 软考中级|软件设计师-知识点整理
  • HTML5基础
  • python,ipython 和 jupyter notebook 之间的关系
  • 聊聊DoIP吧(三)-端口号port
  • 【将xml文件转yolov5训练数据txt标签文件】连classes.txt都可以生成
  • 针对k8s集群已经加入集群的服务器进行驱逐
  • go 1.22 增强 http.ServerMux 路由能力
  • 赶紧收藏!2024 年最常见 20道设计模式面试题(二)
  • Java面向对象设计 - Java泛型约束
  • 什么是内存泄漏?如何避免内存泄漏?
  • 元组(tuple)(Python)