vite开发chrome扩展
事前准备Chrome Extensions开发指南 - Chrome Developershttps://developer.chrome.com/docs/extensions/mv3/
创建项目1npm create vite
安装核心依赖1npm install @samrum/vite-plugin-web-extension -D
该依赖通过 vite plugin 钩子实现了资源路径转换,并根据 manifest 对象生成 serviceWorker.js 和 manifest.json 文件,详情信息请查看官网
安装辅助依赖
适用于 TypeScript chrome 全局API
1npm install @types/chrome -D
使用方法vite.config.ts1234567891011121314151617import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import webExtension ...
TypeScript封装键盘事件
由于js是单线程,以及浏览器的键盘事件,最多只能做到关于Ctrl、Shift、Alt加任意一个的键位,无法做到同时使用方向键上和右,这在网页游戏中是致命的,所以在下实现了多重组合键的事件绑定
注意在使用组合键事件时,暂不支持声明Ctrl++这种按键,最好避免使用 ‘+’ 和 ‘‘ 的键位,因为 ‘+’ 作为连接组合键,’‘作为键盘事件的命名
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283class KeyboardBinding { // 声明一个索引,区分订阅事件 index: number // 声明一个事件对象,以key, fn形式存储键盘事件 events: Record<string, (e: KeyboardEvent) => void> // 声明一个数组,用于记录键 ...
Canvas五子棋
构建画布并获取canvas 2d绘图引擎12345678910111213141516const canvas = document.createElement("canvas");// 设置canvas容器宽高,注意不推荐使用css设置宽高canvas.width = 800;canvas.height = 800;// 设置背景色、位置等canvas.style["display"] = "block"canvas.style["margin"] = "0 auto"canvas.style["background"] = "#0a0"// 将canvas元素追加到body中document.body.append(canvas);// 获取画笔const ctx = canvas.getContext("2d");
绘制棋盘
棋盘由多条横线和纵线组合而成
由于设定宽度为800,预留100空间,实际的棋盘宽为700
为了好 ...
前端开发环境准备
前情提示,适合有点计算机基础的,然后尽量有自己的梯子
scoop个人推荐的windows安装包管理器
官网传送门
安装到指定目录(推荐)下方命令建议在桌面路径下执行
1irm get.scoop.sh -outfile 'install.ps1'
-ScoopDir指定scoop的路径
1.\install.ps1 -ScoopDir 'D:\tools\Scoop'
git个人推荐安装mingit
scoop安装(要点运气,国内时不时墙了Github)
1scoop install mingit
备用方案:git-for-windows传送门
nodescoop安装(要点运气,国内时不时墙了Github)
1scoop install nodejs-lts
备用方案:下载传送门
配置国内镜像1npm config set registry https://registry.npmmirror.com
vscode官网传送门
推荐安装插件
EditorConfig for VS Code
Error Lens
ESLint
G ...
CentOS7.6安装PostgreSQL
添加Postgres仓库源1yum install -y https://download.postgresql.org/pub/repos/yum/reporpms/EL-7-x86_64/pgdg-redhat-repo-latest.noarch.rpm
安装PostgreSQL1yum install -y postgresql14-server
初始化PostgreSQL1/usr/pgsql-14/bin/postgresql-14-setup initdb
本机添加PostgreSQL服务1systemctl enable postgresql-14
开启PostgreSQL服务1systemctl start postgresql-14
PostgreSQL设置外部访问
监听所有请求
/var/lib/pgsql/14/data/postgres.conf
在文件中找到#listen_addresses=’localhost’,把他修改为listen_addresses = ‘*’
1listen_addresses = ‘*’
设置ip段允许访问PostgreSQL
/var/lib/pgsql/14/data/pg_hba.conf
在IPv4 local connections往下添加以下内容即可
12# IPv4 local connections:host all all 0.0.0.0/0 scram-sha-256
修改PostgreSQL数据库默认用户postgres密码
登录PostgreSQL1sudo -u postgres psql
键入修改密码SQL语句1ALTER USER postgres WITH PASSWORD '密码';
修改linux系统postgres用户的密码删除用户postgres的密码1sudo passwd -d postgres
设置用户postgres的密码1sudo -u postgres passwd
通用编程概念
变量与可变性123456// 错误let x = 5;println!("The value of x is {}", x);x = 6; // cannot assign twice to immutable variable `x`println!("The value of x is {}", x);
123456// 正确let mut x = 5;println!("The value of x is {}", x);x = 6;println!("The value of x is {}", x);
变量与常量
常量(constant),常量在绑定值以后也是不可变的,但是它与不可变的变量有很多区别
不可以使用mut,常量永远都是不可变
声明常量使用const,它的类型必须被标注
常量可以在任何作用域内进行声明,包括全局作用域
常量只可以绑定到常量表达式,无法绑定到函数的调用结果或只能在运行时才能计算出的值 ...
Nginx配置
http转发https123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384user nginx nginx;worker_processes 1;#error_log logs/error.log;#error_log logs/error.log notice;#error_log logs/error.log info;#pid logs/nginx.pid;events { worker_connections 1024;}http { include mime.types; default_type application/octet-stream; #log_format main '$remote_add ...
CentOS7.6源码安装Nginx
安装编译工具链1yum install make cmake gcc gcc-c++
安装nginx依赖1yum install pcre pcre-devel zlib zlib-devel openssl openssl-devel
下载并解压nginx源码123wget http://nginx.org/download/nginx-1.22.1.tar.gztar -xvf nginx-1.22.1.tar.gzcd nginx-1.22.1
创建nginx用户组1groupadd -r nginx
创建nginx用户1useradd -M -s /sbin/nologin -g nginx nginx
创建安装目录1mkdir -p /usr/local/nginx
编译配置,生成Makefile文件1./configure --user=nginx --group=nginx --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module --with-file-ai ...