第 23 话
date
Mar 27, 2023
tags
summary
type
Post
status
Published
slug
series-23
给 VSCode Vim 中的 EasyMotion 设置快捷键
"vim.normalModeKeyBindingsNonRecursive": [
{
"before": ["leader", "s"],
"after": ["leader", "leader", "2", "s"]
}
]
用
leader+s
按键来触发 EasyMotion 的 2 个字符查找功能![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2F3c42da9a-397a-4f58-9b5c-eb0b2ed46928%2FUntitled.gif%3Fid%3D860d7a7b-fe17-4bf7-a23f-d40b9a3aae55%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3D51faGd4LzNeUcJSrJQsubQpHvNuXPgAFcVZuKXNiwKQ?table=block&id=860d7a7b-fe17-4bf7-a23f-d40b9a3aae55&cache=v2)
使用 Surge 的负载均衡策略组(Load Balance Group)
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2F9a6d3bc1-2347-4c4b-a139-ab174864721e%2FUntitled.png%3Fid%3D993bdf1d-d0f1-4da9-b789-184ec3d6c3e2%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3Dy6gy0VVQufqYQZ0OwIilJrAbOrQuHrhZBUbdB65f6c0?table=block&id=993bdf1d-d0f1-4da9-b789-184ec3d6c3e2&cache=v2)
用 ChatGPT 来取变量名
魔法咒语(Prompt)
You're an expert in Javascript for 20 years, you had developed many websites, and have best practices in terms of naming your functions and variables. I'm developing in Javascript and I need some suggestions for my function, I will give you a bunch of code. Please just give the function name directly, no additional explanation is needed.
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2F7eb8218f-ebf2-4e7b-a799-5c2ee3ace1f1%2FUntitled.png%3Fid%3Db2173aa0-2f3c-4bf9-ad38-3bc46e484c46%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3DbrC3e5ehvqxUx0O8iB35QR6fgcgu_qSr-I9xt87t_dg?table=block&id=b2173aa0-2f3c-4bf9-ad38-3bc46e484c46&cache=v2)
使用 Raycast 的 HotKey 功能替代 Manico
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2F6144fc33-fcd8-46d7-ba0f-c1f73cc3e2aa%2FUntitled.png%3Fid%3Dc6f3400b-73d0-410d-9e34-273a9af2fd21%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3DT8AvIwyQEdYBKv9o35LRQ8j1oc0HCRVkuumUKtArEsY?table=block&id=c6f3400b-73d0-410d-9e34-273a9af2fd21&cache=v2)
CSS 实现像素风
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2F4ebb2ac1-2b0b-4c21-af21-0c811c53a7c3%2FUntitled.png%3Fid%3D79c92cf8-921b-4180-a63b-72d8d928e2a7%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3Dk05x5VBEn7WfWpc-7r1xfih9spmM-ypmh4vYMM0G_vk?table=block&id=79c92cf8-921b-4180-a63b-72d8d928e2a7&cache=v2)
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2F5b7a4093-2167-406a-a832-1aa51a404fe3%2F%25E5%25B1%258F%25E5%25B9%2595%25E5%25BD%2595%25E5%2588%25B62023-04-12_%25E4%25B8%258A%25E5%258D%258811.30.56.gif%3Fid%3D4305430d-139b-4f58-ae94-b92cbc25186d%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3DkLqOV6oLeJMvpyCAvM3VU8LaiNT0jbQSnl2yImUpr6k?table=block&id=4305430d-139b-4f58-ae94-b92cbc25186d&cache=v2)
background-image: radial-gradient(transparent 1px, var(--bg-color) 1px);
background-size: 4px 4px;
backdrop-filter: saturate(50%) blur(4px);
参考 Element Plus 的源码,实现原理是利用
radial-gradient
来给导航条的背景挖了很多透明的小孔![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2F488d0daa-3eff-417b-bd37-6153a090ac71%2FUntitled.png%3Fid%3D937cc143-d51c-44ba-9979-7d3d27be4ee5%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3DwdffOHdHjQp62wvaoNem7GEf1ATFqJnn1rboYBvV7pE?table=block&id=937cc143-d51c-44ba-9979-7d3d27be4ee5&cache=v2)
Self Host 的 WakaTime 替代方案 Wakapi
之前一直使用 Wakatime 来记录编程的时间。最近发现这个可以自己部署的方案,于是在 VPS 上部署一个玩玩。
wakapi 有个集成 wakatime 的功能,把所有请求转发到 wakatime,这样就可以让两个服务同时使用
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2Fdda1c519-9c83-4880-8f3c-f27afcfb23f5%2FUntitled.png%3Fid%3D3f3913bd-e11c-48b4-b493-247dd9b04910%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3DKai2KYJfgX1FVTQsr3qENywINQmWsxCZVCtWVumoAUw?table=block&id=3f3913bd-e11c-48b4-b493-247dd9b04910&cache=v2)
使用 VSCode Tunnel
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2Fe56bc6b2-0a3e-44e3-95a1-80f68416a386%2FUntitled.png%3Fid%3Da96d1fc3-888e-4e7f-9ded-c6825c49da11%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3Dh6fG2VCpl6i17kXTvWnkXEMI4ID_N4kUNzUbSkUUlFE?table=block&id=a96d1fc3-888e-4e7f-9ded-c6825c49da11&cache=v2)
之前使用 Code-Server 来家里的黑苹果主机当做云 IDE、和云开发环境。现在有了 VSCode Tunnel ,不需要再额外部署和维护 code-server。打开 VS Code 点两下就能搞定。不仅能通过另一台电脑的 VSCode 连接,还能直接在浏览器中打开 URL 直接访问。配合端口转发功能就和本地开发的体验基本一致
![在另一台电脑的 VS Code 连接](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2Fd30e1720-bab9-43a4-a36d-d62069f9890f%2FUntitled.png%3Fid%3Dc146729d-fc77-46a2-bbc8-8f2574e6e989%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3DMfNtepgI1wCVgjKUA7apCFDigW0FqLZuV23CA_BEltM?table=block&id=c146729d-fc77-46a2-bbc8-8f2574e6e989&cache=v2)
![通过 vscode.dev 在浏览器中直接访问(使用 PWA 版本)](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F91735e6e-abba-45da-8487-1a530eb0ec04%2Fa5271ba2-d4bd-490c-8258-1f20f8f293cb%2FUntitled.png%3Fid%3D8594bf1a-b2ca-40ab-b906-6c5ac88aca09%26table%3Dblock%26spaceId%3D91735e6e-abba-45da-8487-1a530eb0ec04%26expirationTimestamp%3D1718683200000%26signature%3Dy0ObsO3zdyjn8aLEcgT5LmOGvg7H4BfJxbdKF_zpS24?table=block&id=8594bf1a-b2ca-40ab-b906-6c5ac88aca09&cache=v2)