当前位置: 首页 > 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'},
});

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

相关文章:

第2讲:pixi.js 绘制HelloWorld

基于第0讲和第1讲&#xff0c;我们增添了vite.config.ts文件。并配置了其他的http端口。 此时&#xff0c;我们删除掉没用的东西。 删除 conter.ts、typescript.svg 在main.ts中改成如下内容&#xff1a; import {Application, Text} from pixi.js import ./style.css// 指明…...

golang HTTP2 https测试POST变GET问题小记

概述 因为工作需要协助修改某个golang程序&#xff0c;添加双向认证。但是在调整的过程遇到一个HTTP POST请求变成GET诡异的问题&#xff0c;最后各种搜索&#xff0c;总算解决&#xff0c;博文记录&#xff0c;用于备忘。 代码 服务端 因工作内容&#xff0c;代码有删减&a…...

Linux下的lvm镜像与快照

lvm镜像(mirror) (1)划分三个PV&#xff0c;其中2个PV大小要一模一样 Disk /dev/sdb: 21.5 GB, 21474836480 bytes 255 heads, 63 sectors/track, 2610 cylinders Units cylinders of 16065 * 512 8225280 bytes Sector size (logical/physical): 512 bytes / 512 bytes I/…...

嵌入式linux系统中SPI子系统原理分析01

大家好,今天给大家分享一下,如何使用linux系统中的SPI通信协议,实现主从设备之间的信息传递。 SPI是一种常见的设备通用通信协议。它是一个独特优势就是可以无中断发送数据,可以连续发送或接收任意数量的位。而在I2C和UART中,数据以数据包的形式发送,有限定位数。 …...

Part 4.2 背包动态规划

->背包模型模板(0/1,分组&#xff0c;完全&#xff0c;多重)<- [NOIP2018 提高组] 货币系统 题目背景 NOIP2018 提高组 D1T2 题目描述 在网友的国度中共有 n n n 种不同面额的货币&#xff0c;第 i i i 种货币的面额为 a [ i ] a[i] a[i]&#xff0c;你可以假设每…...

Elasticsearch-使用Logstash同步Mysql

1.安装logstash es服务器版本必须和logstash版本一致 7.9.2 在/usr/local/src/下新建logstash文件夹&#xff0c;解压 下载logstash后查看是否安装成功&#xff0c;在logstash的bin目录下输入指令&#xff1a; ./logstash -e input { stdin { } } output { stdout {} }2.my…...

6.17作业

升级优化自己应用程序的登录界面。 要求&#xff1a; 1. qss实现 2. 需要有图层的叠加 &#xff08;QFrame&#xff09; 3. 设置纯净窗口后&#xff0c;有关闭等窗口功能。 4. 如果账号密码正确&#xff0c;则实现登录界面关闭&#xff0c;另一个应用界面显示。 //发送端头文件…...

算法思想个人总结(结合生活理解)

主要思想: 结合生活和游戏理解思想,先知道什么场景用什么算法,然后再理解就能记住 遇到问题可以考虑选择使用,这样才是学活了 https://www.yuque.com/yuqueyonghu5znoyv/ifb5ga/nfcvg3ft9ryuqeem?singleDoc# 《元启发式算法》...

openh264 帧间预测编码过程源码分析

openh264 OpenH264 是一个开源的 H.264 编码和解码器&#xff0c;由思科系统开发并维护。它专为实时应用程序如 WebRTC 设计&#xff0c;提供了从基础到高级特性的广泛支持。OpenH264 的编码器支持从 Constrained Baseline Profile 到 5.2 级别&#xff0c;允许任意分辨率的编…...

Linux网络 - HTTP协议

文章目录 前言一、HTTP协议1.urlurl特殊字符 requestrespond 总结 前言 上一章内容我们讲了在应用层制定了我们自己自定义的协议、序列化和反序列化。 协议的制定相对来讲还是比较麻烦的&#xff0c;不过既然应用层的协议制定是必要的&#xff0c;那么肯定已经有许多计算机大佬…...

面试题——Nginx

1.Nginx是什么&#xff1f; 是一个高性能的Web服务器和反向代理服务器&#xff0c;也可以作为静态文件的缓存服务器&#xff0c;也能够进行负载均衡。 2.Nginx的作用&#xff1f; 1.反向代理&#xff1a;将多台服务器代理为一台服务器。客户端不了解底层服务端。 2.负载均衡…...

持续学习的综述: 理论、方法与应用

摘要 为了应对现实世界的动态&#xff0c;智能系统需要在其整个生命周期中增量地获取、更新、积累和利用知识。这种能力被称为持续学习&#xff0c;为人工智能系统自适应发展提供了基础。从一般意义上讲&#xff0c;持续学习明显受到灾难性遗忘的限制&#xff0c;在这种情况下…...

跨域资源共享(CORS)问题与解决方案

跨域资源共享&#xff08;CORS&#xff0c;Cross-Origin Resource Sharing&#xff09;是现代web开发中常见且重要的一个概念。它涉及到浏览器的同源策略&#xff08;Same-Origin Policy&#xff09;&#xff0c;该策略用于防止恶意网站从不同来源窃取数据。然而&#xff0c;在…...

实用软件分享-----一款免费的人工智能替换face的神器

专栏介绍:本专栏主要分享一些实用的软件(Po Jie版); 声明1:软件不保证时效性;只能保证在写本文时,该软件是可用的;不保证后续时间该软件能一直正常运行;不保证没有bug;如果软件不可用了,我知道后会第一时间在题目上注明(已失效)。介意者请勿订阅。 声明2:本专栏的…...

不可思议!这款 Python 库竟然能自动生成GUI界面:MagicGUI

目录 什么是MagicGUI&#xff1f; ​编辑 MagicGUI的工作原理 安装MagicGUI 创建你的第一个GUI ​编辑 其他案例 输入值对话框 大家好&#xff0c;今天我们来聊一聊一个非常有趣且实用的Python库——MagicGUI。这个库可以让你用最少的代码&#xff0c;快速创建图形用户…...

论文发表CN期刊《高考》是什么级别的刊物?

论文发表CN期刊《高考》是什么级别的刊物&#xff1f; 《高考》是由吉林省长春出版社主管并主办的省级教育类期刊&#xff0c;期刊以科教兴国战略为服务宗旨&#xff0c;专门反映和探索国内外教育教学和科研实践的最新成果。该期刊致力于为广大教育工作者提供一个高质量的学术…...

离散数学复习

1.关系的介绍和性质 &#xff08;1&#xff09;序偶和笛卡尔积 两个元素按照一定的顺序组成的二元组就是序偶&#xff0c;使用尖括号进行表示&#xff0c;尖括号里面的元素一般都是有顺序的&#xff1b; 笛卡尔积就是有两个集合&#xff0c;从第一个集合里面选择一个元素&am…...

华为网络设备高频命令

1.system-view • 用法&#xff1a;在用户视图下执行 system-view 命令。 • 作用&#xff1a;进入系统视图&#xff0c;以便进行配置性的操作。 • 场景&#xff1a;当需要对设备进行系统级的配置时。 2.sysname XXX • 用法&#xff1a;执行 [Huawei]sysname XXX 命令。…...

信友队:南风的收集

C. [202406C]楠枫的收集 文件操作 时间限制: 1000ms 空间限制: 262144KB 输入文件名: 202406C.in 输出文件名: 202406C.out Accepted 100 分 题目描述 一年四季&#xff0c;寒暑交替&#xff0c;楠枫总是会收集每一个季节的树叶&#xff0c;并把它们制作成标本收集起来。当…...

找工作小项目:day16-重构核心库、使用智能指针(3)

day16-重构核心库、使用智能指针&#xff08;3&#xff09; 最后将使用这个库的方式进行展示。 1、客户端 在while ((o getopt(argc, argv, optstring)) ! -1)所有的操作都是获取参数的操作&#xff0c;threads 、msgs 和wait 分别指线程数、消息长度以及等待时间。 创建一…...

软考中级|软件设计师-知识点整理

目录 计算机网络概论 计算机系统基础知识 中央处理单元 数据表示 校验码 计算机体系结构 计算机体系结构的发展 存储系统 输入/输出技术 安全性、可靠性与系统性能评测基础知识 加密技术和认证技术 计算机可靠性 程序设计语言基础知识 程序设计语言概述 程序设计…...

HTML5基础

1 HTML基础概念&#xff08;难点&#xff09; WWW&#xff08;World Wide Web&#xff0c;万维网&#xff09;是一种建立在 Internet 上的信息资源网络。 WWW 有 3 个基本组成部分&#xff0c;分别是 URL&#xff1a;Universal Resource Locators&#xff0c;统一资源定位器 HT…...

python,ipython 和 jupyter notebook 之间的关系

python&#xff0c;ipython 和 jupyter notebook 之间的关系 文章目录 python&#xff0c;ipython 和 jupyter notebook 之间的关系1. Python2. IPython3. Jupyter Notebook启动 Jupyter Notebook 关系总结 Python、IPython 和 Jupyter Notebook 是相互关联但具有不同功能的工具…...

聊聊DoIP吧(三)-端口号port

DoIP在UDP和TCP建立连接和发送诊断报文的过程中使用的端口定义如下&#xff1a;...

【将xml文件转yolov5训练数据txt标签文件】连classes.txt都可以生成

将xml文件转yolov5训练数据txt标签文件 前言一、代码解析 二、使用方法总结 前言 找遍全网&#xff0c;我觉得写得最详细的就是这个博文⇨将xml文件转yolov5训练数据txt标签文件 虽然我还是没有跑成功。那个正则表达式我不会改QWQ&#xff0c;但是不妨碍我会训练ai。 最终成功…...

针对k8s集群已经加入集群的服务器进行驱逐

例如k8s 已经有很多服务器&#xff0c;现在由于服务器资源过剩&#xff0c;需要剥离一些服务器出来 查找节点名称&#xff1a; kubectl get nodes设置为不可调度&#xff1a; kubectl cordon k8s-node13恢复可调度 kubectl uncordon k8s-node13在驱逐之前先把需要剥离驱逐的节…...

go 1.22 增强 http.ServerMux 路由能力

之前 server func main() {http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {fmt.Println("Received request:", r.URL.Path)fmt.Fprintf(w, "Hello, client! You requested: %s\n", r.URL.Path)})log.Println("Serv…...

赶紧收藏!2024 年最常见 20道设计模式面试题(二)

上一篇地址&#xff1a;赶紧收藏&#xff01;2024 年最常见 20道设计模式面试题&#xff08;一&#xff09;-CSDN博客 三、解释抽象工厂模式&#xff0c;并给出一个实际应用的例子。 抽象工厂模式是一种创建型设计模式&#xff0c;用于创建一系列相关或依赖对象的接口&#x…...

Java面向对象设计 - Java泛型约束

Java面向对象设计 - Java泛型约束 无限通配符 通配符类型由问号表示&#xff0c;如<&#xff1f;> 。 对于通用类型&#xff0c;通配符类型是对象类型用于原始类型。 我们可以将任何已知类型的泛型分配为通配符类型。 这里是示例代码: // MyBag of String type M…...

什么是内存泄漏?如何避免内存泄漏?

**内存泄漏&#xff08;Memory Leak&#xff09;**是指在程序运行过程中&#xff0c;已经动态分配的堆内存由于某种原因程序未释放或无法释放&#xff0c;造成系统内存的浪费&#xff0c;导致程序运行速度减慢甚至系统崩溃等严重后果。内存泄漏具有隐蔽性、积累性的特征&#x…...

宜昌做网站公司/市场推广

今天的帖子是关于SQL中的NULL值的&#xff0c;由我的朋友和数据库向导Kaley提供。如果你想了解有关 SQL&#xff0c;Oracle 数据库以及使查询运行更快的更多信息&#xff0c;请访问他的网站。这是一个使很多萌新开发人员陷入困境的话题-SQL查询中的NULL值的概念。每当你向数据库…...

凡科做的网站怎么样/北京seo优化推广

方法1&#xff1a;sudo apt-get -f install -f 尝试修正系统依赖损坏处 方法2&#xff1a;修改/etc/apt/sources.list文件&#xff0c;用下面的地址替换原来的官方默认地址 deb cdrom:[Ubuntu 16.04.3 LTS _Xenial Xerus_ - Release amd64 (20170801)]/ xenial main restrict…...

成都手机网站建/免费下载百度

Matlab 中经常需要对矩阵进行维度上的操作&#xff0c;下面做一个简单的总结&#xff1a; 在Matlab中&#xff0c;不管矩阵的维度是多少&#xff0c;数据在内存中的存储都是按照 “行-列-页” 的顺序进行存储的。比如&#xff1a; >> a [11,12,13; 21,22,23]a <spa…...

网站建设人员培训/网站如何快速收录

wrap是包裹元素的作用&#xff0c;比如我想在img外面包裹一个a标签时&#xff0c;可以这样写法&#xff1a; $(function(){$(img).wrap(function(){return <a href" this.src " title"点击查看原图" target"_blank"></a>;}) }); 此…...

做设计网站的工作/山东省住房和城乡建设厅

etcdserver.NewServer函数第一步就是调用bootstrap函数&#xff08;定义在server/etcdserver/bootstrap.go文件中&#xff09;&#xff0c;其输入参数是config.ServerConfig&#xff0c;输出参数是bootstrappedServer&#xff0c;其主要作用是对存储Storage、集群信息Cluster和…...

wordpress文章页幻灯片/国产长尾关键词拘挖掘

机器人视觉系统是指用计算机来实现人的视觉功能&#xff0c;也就是用计算机来实现对客观的三维世界的识别。人类接收的信息70%以上来自视觉&#xff0c;人类视觉为人类提供了关于周围环境 最详细可靠的信息。人类视觉所具有的强大功能和完美的信息处理方式引起了智能研究者的极…...