.gitignore文件不生效？
· One min read
windows连接外屏间歇性黑屏？
· One min read
pm2开机启动node项目
· One min read
解决方案
pm2 save
pm2 startup
pm2 save会将当前pm2运行的列表保存在～/.pm2/dump.pm2，方便开机时重新加载
pm2 startup会在/etc/systemd/system目录下生成service文件，开机执行
html2canvas截图白屏，图片偏移终极解决方案
· 2 min read
需求场景
需要实现活动页面，点击分享弹出海报图片，并长按 保存
图片偏移原因一：滚动条相关
html2canvas 的参数中，有 2 个参数，x,y。是裁剪位置的 x,y 坐标。x 方向一般没有滚动条，问题不大，y 方向一般是有滚动条的，这个时候就要算上滚动条偏移的距离才可以。
图片偏移原因二：transform 属性
解决掉滚动条导致的偏移问题后，ios 下截图没有偏移问题了，但是安卓会出现。经过多次调试及搜索相关资料，终于发现是因为弹窗使用了 transform 属性。后来去掉 transform 使用 flex 解决了。
截图空白原因三：图片未加载完成就调用 html2canvas
这个问题也是显而易见的，图片还没加载好就截图，肯定会出现问题。
其他问题：图片跨域
需要使用 useCORS 属性，并且服务器开启 Access-Control-Allow-Origin : *，当然也可以使用代理方式
终极解决方案代码
const sharePosterImg = ref("");
// 等待海报中的图片加载完成
await loadImage(needLoadImg);
// vue等待页面渲染完成
nextTick(() => {
const sharePoster = document.getElementById("share-poster");
//计算图片宽高，偏移距离，滚动条偏移距离
html2canvas(sharePoster, {
//允许跨域
useCORS: true,
scale: 2,
width: sharePoster.offsetWidth,
height: sharePoster.offsetHeight,
x: sharePoster.getBoundingClientRect().left,
//需要加上滚动条偏移距离
y: window.pageYOffset + sharePoster.getBoundingClientRect().top,
}).then((canvas) => {
//赋值base64
sharePosterImg.value = canvas.toDataURL("image/png");
});
});
ubuntu安装php环境
· One min read
卸载旧版本
#删除php的相关包及配置
sudo apt-get autoremove php7*
#清除dept列表
sudo apt purge `dpkg -l | grep php| awk '{print $2}' |tr "\n" " "`
#检查是否卸载干净（无返回就是卸载完成）
dpkg -l | grep php7*
安 装php7.4
sudo apt install php8.1
sudo apt install php8.1-fpm
sudo apt install php8.1-mysql
sudo apt install php8.1-mbstring
sudo apt install php8.1-xml
sudo apt install php8.1-curl
sudo apt install php8.1-gd
sudo apt install php8.1-bcmath
sudo apt install php8.1-imagick
sudo apt install php8.1-zip
sudo apt install php8.1-intl
ubuntu修改ssh登录提示信息
· One min read
git常用场景操作指南
· 2 min read
场景一：fork别人的代码，添加功能的同时想要同步作者的更新。
添加upstream的git地址
git remote add upstream url
同步更新
git fetch upstream
git merge upstream/master
场景二：fork别人的代码，想要为他添加新功能Pull request
# 基于远程master分支创建新的分支,开发完成后提交pull request
git checkout -b feature-1 upstream/master
场景三：删除本地以及远程分支
git branch -d dev
git push origin -d dev
场景四：撤销commit（版本回退）
#例如从状态D回到状态B
git reset --hard B
git reset --soft D
git push
场景五： 合并多次commit
git rebase -i commitId
vim状态下第一个保持pick，下面的改为s（squash）
vim状态下在不需要的commit信息加#注释
git push origin branchName -f
场景六：多分支并行开发
git worktree add ../A -b vA
git push --set-upstream origin vA
场景七：清除全部git记录（慎用，主要用来清理之前的不规范提交）
//新建没有提交记录的分支
git checkout --orphan latest_temp_branch
git add -A
git commit -m "Initial commit"
// 删除原来分支
git branch -d master
// 将当前分支重命名为master
git branch -m master
// 强制同步修改至远程仓库
git push -f origin master
// 关联本地 master 到远程 master
git branch --set-upstream-to=origin/master
场景八：upate .gitignore
git rm -r --cached .
git add .
git commit -m 'chore: update .gitignore'
git push -u origin master
源码理解：手写EventBus
· One min read
class EventBus {
map = {}
on(type, handler) {
this.map[type] = (this.map[type] || []).concat(handler)
}
fire(type, data) {
this.map[type] && this.map[type].forEach(handler => handler(data))
}
off(type, handler) {
if(this.map[type]) {
if(!handler) {
delete this.map[type]
} else {
let index = this.map[type].indexOf(handler)
this.map[type].splice(index, 1)
}
}
}
}
const eventBus = new EventBus()
eventBus.on('click:btn', data => {
console.log(data)
})
eventBus.fire('click:btn', {a: 1, b: 2})
eventBus.off('click:btn')
eventBus.fire('click:btn', {a: 1, b: 2})
vue-cli移除typescript
· One min read
树莓派查看cpu温度
· One min read
解决方案
vcgencmd measure_temp