Alaye的小屋

新云服务器购买与 1Panel 配置指南

Fri, 10 Apr 2026 00:00:00 GMT

引

最近在玩 AstrBot，想装一些 MCP 和插件，但是配置使用 npx 启动的本地 MCP 服务器时，我的阿里云学生机 2H2G 会直接卡死，悲。😭它小小的身体可能承载了太多，目前这台小机上部署了 Astro 博客、用于 Obsidian 云同步的 Couch DB、发说说的 Ech0。思考再三，还是决定花费 528 RMB 来购买一台三年的腾讯云 2H4G 的服务器，将 AstrBot 这样占用较大的服务迁移到新机器上来部署。

配置

来到腾讯云的主页，找到对应型号的服务器下单就可以了。系统方面因为之前使用的这台阿里云上使用的是一年多前 @Kindyear 带我安装的宝塔面板，这次我想试试 1Panel。所以选择了直接带 1Panel 面板的版本，这点不错，面去了自己安装的步骤。付款成功之后，来到腾讯云的控制台就能看到刚刚购买的服务器了。在控制台点击登录，来到终端，使用 1pctl --help 指令来查看相关信息。

root@VM-0-11-ubuntu:~# 1pctl --help
------------------------------------------------------------
                        1Panel 控制脚本
------------------------------------------------------------
Usage:
  ./1pctl [COMMAND] [ARGS...]
  ./1pctl --help

Commands:
  status [core|agent]         检查 1Panel 服务状态
  start [core|agent|all]      启动 1Panel 服务
  stop [core|agent|all]       停止 1Panel 服务
  restart [core|agent|all]    重启 1Panel 服务
  uninstall                   卸载 1Panel 服务
  user-info                   获取 1Panel 用户信息
  listen-ip                   切换 1Panel 监听 IP
  version                     查看 1Panel 版本信息
  update                      修改 1Panel 系统信息
  reset                       重置 1Panel 系统信息
  restore                     恢复 1Panel 服务及数据

启动面板， 1pctl start

查看用户信息，1pctl user-info

root@VM-0-11-ubuntu:~# 1pctl start
------------------------------------------------------------
                        启动 1Panel 服务
------------------------------------------------------------
🟢[OK]启动 Core: 成功
🟢[OK]启动 Agent: 成功
------------------------------------------------------------
root@VM-0-11-ubuntu:~# 1pctl user-info
============================================================
                       获取 1Panel 用户信息
============================================================
面板地址: http://$LOCAL_IP:8090/tencentcloud 
面板用户: z2pxxxxxsa
面板密码: 5jxxxxxx1w
提示: 修改密码可执行命令: 1pctl update password
------------------------------------------------------------

这样 1Panel 就是正常工作的了，然后使用提供的初始面板用户名和密码来访问 1Panel。http://$LOCAL_IP:8090/tencentcloud 其中的 $LOCAL_IP 指的就是服务器的 IP 了，这个在腾讯云的控制台可以查看，将实际的 IP 地址替换到这个地址中，就可以访问到面板了。

安全

为了安全性，登陆成功后来到菜单中的 面板设置 ，修改用户名和密码。以及默认的端口，降低被恶意扫端口攻击的概率。

在腾讯云控制台点击服务器，进入二级菜单的防火墙，同步修改允许访问面板的端口，不然改了默认端口就访问不到网页面板了。在再来到终端处，使用 1pctl restart 重启面板。

这样就可以开始美美使用新服务器啦。😎

mise 一个工具解决多个开发环境版本管理

Mon, 23 Mar 2026 00:00:00 GMT

引

最近想为 Ech0 做一些代码贡献，需要配置 GoLang 环境，平常经常需要 Java、Node 版本切换的我顺所当然的想，这次配置 Go 环境是不是应该也借助一个开发环境版本管理工具，往常像 Node 使用 nvm，Go 是不是也有类似的工具呢。于是在网络上搜索，逛着逛着发现了一个叫 mise 的工具，研究了一下，居然一个工具支持：

这么多的开发环境管理。

这下不得不试试了🤗

安装

作为 Windows 用户，每次安装软件都要注意安装到非 C 盘。

所以需要先设置一下 mise 的数据位置，根据官方文档可以通过 MISE_DATA_DIR 环境变量来设置：

setx MISE_DATA_DIR D:\DevEnv\mise\data

这里使用 winget 来安装（其他安装渠道也可以，如 npm、powershell），我之前安装 oh-my-posh 的时候配置了 winget 的包安装位置所以直接使用 winget 来安装。

winget install jdx.mise

启用 mise 的工具和环境变量自动加载

以 powershell 为例，打开 powershell 的配置文件：

# create profile if it doesn't already exist
if (-not (Test-Path $profile)) { New-Item $profile -Force }
# open the profile
Invoke-Item $profile

在配置文件中添加：

(&mise activate pwsh) | Out-String | Invoke-Expression

将 mise 添加到环境变量

将刚刚配置的 MISE_DATA_DIR 中的 D:\DevEnv\mise\data\shims 添加到 环境变量 - 用户变量 的 path

[!IMPORTANT] Windows 环境变量中的用户变量和系统变量效果是不一样的,如果只配置在系统变量中，会导致普通命令行读取不到环境变量而显示不存在该指令，而管理员终端正常使用

使用

mise use -g go@1.26.1

go version

❯ go version
go version go1.26.1 windows/amd64

可以使用啦 mise😋~

Windows 自动切换夜间模式

Fri, 24 Oct 2025 00:00:00 GMT

引

在 Windows 中，系统原生并不支持根据时间自动切换深色/浅色主题。然而习惯了手机等设备近年来普及的自动夜间模式，对比 WIndows 会没有统一的体验，并且长时间面对过亮可能影响视觉舒适度与工作效率。这里介绍几种实现 Windows 自动切换夜间模式的工具。

AutoDarkMode

AutoDarkMode/Windows-Auto-Night-Mode: Automatically switches between the dark and light theme of Windows 10 and Windows 11

AutoDarkMode 还附带有更多的相关自定义设置，且轻量化。安装完大约占用 200MB 存储。

PowerToys - Light Switch

microsoft/PowerToys: Microsoft PowerToys is a collection of utilities that help you customize Windows and streamline everyday tasks

PowerToys 是微软官方推出的面向高级用户的 Windows 效率增强工具集，其中 Light Switch 模块提供了基础的自动主题切换功能。由于 PowerToys 还附带其他实用工具，整体比较大，安装完大约占用 850MB 存储，远大于 AutoDarkMode。

总结

如果你只想要一个简单、智能、低开销的自动夜间模式切换器，AutoDarkMode 是更优选择。

而如果你已经是 PowerToys 用户，或希望在一个工具中管理多种 Windows 增强功能，那么使用其内置的 Light Switch 模块也足够满足基础需求。

Windows 中的 Rust 开发环境配置

Wed, 17 Sep 2025 00:00:00 GMT

MSVC & Windows SDK

在正式开始安装 Rust 之前需要确保已经安装了 C++ 桌面开发环境。建议可以在启动 Rustup 之前，手动下载 Visual Studio Installer，并可直接到单个组件页面搜索并勾选必要的 MSVC 和 Windows SDK，达到最小化安装体积的效果。并在语言包中勾选英文（建议必选）和其他需要的语言，如中文。同时记得在安装位置选择卡中，根据个人情况调整安装位置到非 C 盘，来减少 C 盘占用空间。

配置镜像

访问 RsProxy，根据提示信息，编辑系统环境变量，设置 Rustup 镜像，加快接下来安装 Rust 下载默认包的速度。

setx RUSTUP_DIST_SERVER "https://rsproxy.cn"
setx RUSTUP_UPDATE_ROOT "https://rsproxy.cn/rustup"

配置 Rust 安装位置

[!IMPORTANT] 提前设置环境变量进行变更存储位置，否则后续所有依赖库都默认存放到 C 盘。

手动创建一个文件夹，如 rust。并在其中创建 .rustup 和 .cargo 两个子文件夹。编辑系统环境变量，将对应的路径填入其中。

setx RUSTUP_HOME "D:\DevEnv\rust\.rustup"
setx CARGO_HOME "D:\DevEnv\rust\.cargo"

正式安装 Rust

访问入门 - Rust 程序设计语言，下载 Rustup，运行安装程序，查看提示信息，配置不出错的话，默认回车即可。

安装完成后新建终端，使用 rustc --version 验证安装。

PS C:\Users\Alaye> rustc --version
rustc 1.89.0 (29483883e 2025-08-04)

🦀 Hello Rust！

阅读 Rust in Visual Studio Code，在 VSCode 中安装 rust-analyzer 插件。

创建存放项目的文件夹并新建项目，依次运行命令。

cargo new hello_world

cd hello_world
code .

cargo run

查看运行结果！

PS D:\Alaye\CODE\rust-study\hello_world> cargo build
   Compiling hello_world v0.1.0 (D:\Alaye\CODE\rust-study\hello_world)
    Finished `dev` profile [unoptimized + debuginfo] target(s) in 2.36s
PS D:\Alaye\CODE\rust-study\hello_world> cargo run  
    Finished `dev` profile [unoptimized + debuginfo] target(s) in 0.06s
     Running `target\debug\hello_world.exe`
Hello, world!

推荐阅读简介 - Rust 程序设计语言中文版，开启🦀 Rust 的学习之旅~

参考

修复 Conda 导致的 PowerShell 启动缓慢

Mon, 04 Aug 2025 00:00:00 GMT

问题背景

最近发现我的 PowerShell 启动异常缓慢，从正常的瞬间启动延长到了 5~7 秒。作为经常要使用到的使用终端，每次启动都要被硬控好几秒不能使用，这严重影响了效率。

问题诊断过程

性能测量

首先使用 Measure-Command 测试正常启动时间：

Measure-Command { pwsh.exe -Command "exit" }

PS C:\Users\Alaye> Measure-Command { powershell -Command "exit" }

Days              : 0
Hours             : 0
Minutes           : 0
Seconds           : 5
Milliseconds      : 859
Ticks             : 58595344
TotalDays         : 6.78186851851852E-05
TotalHours        : 0.00162764844444444
TotalMinutes      : 0.0976589066666667
TotalSeconds      : 5.8595344
TotalMilliseconds : 5859.5344

测试无配置文件启动时间：

Measure-Command { powershell -NoProfile -Command "exit" }

PS C:\Users\Alaye> Measure-Command { powershell -NoProfile -Command "exit" }

Days              : 0
Hours             : 0
Minutes           : 0
Seconds           : 0
Milliseconds      : 217
Ticks             : 2171056
TotalDays         : 2.5127962962963E-06
TotalHours        : 6.03071111111111E-05
TotalMinutes      : 0.00361842666666667
TotalSeconds      : 0.2171056
TotalMilliseconds : 217.1056

0.22s

对比正常启动时间和无配置文件启动时间，发现相差过大，则可以判断为是启动配置影响了启动时间。

检查 PowerShell 配置文件

检查配置文件位置：

$PROFILE | Get-Member -Type NoteProperty

PS C:\Users\Alaye> $PROFILE | Get-Member -Type NoteProperty

   TypeName: System.String

Name                   MemberType   Definition
----                   ----------   ----------
AllUsersAllHosts       NoteProperty string AllUsersAllHosts=C:\Program Files\PowerShell\7\profile.ps1
AllUsersCurrentHost    NoteProperty string AllUsersCurrentHost=C:\Program Files\PowerShell\7\Microsoft.PowerShell_prof…
CurrentUserAllHosts    NoteProperty string CurrentUserAllHosts=C:\Users\Alaye\Documents\PowerShell\profile.ps1
CurrentUserCurrentHost NoteProperty string CurrentUserCurrentHost=C:\Users\Alaye\Documents\PowerShell\Microsoft.PowerS…

检查配置文件内容来定位问题,可以查看对应路径的内容或者使用命令行：

$PROFILE | Get-Member -Type NoteProperty | ForEach-Object {
    $path = $PROFILE.($_.Name)
    Write-Host "`n=== $($_.Name) ===" -ForegroundColor Yellow
    Write-Host "路径: $path"
    if (Test-Path $path) {
        Write-Host "内容:"
        Get-Content $path | ForEach-Object { Write-Host "  $_" }
    } else {
        Write-Host "文件不存在"
    }
}

发现问题根源

在 CurrentUserAllHosts 配置文件中发现了 Conda 初始化代码：

# C:\Users\Alaye\Documents\PowerShell\profile.ps1
# region conda initialize
# !! Contents within this block are managed by 'conda init' !!
If (Test-Path "D:\DevEnv\anaconda3\Scripts\conda.exe") {
    (& "D:\DevEnv\anaconda3\Scripts\conda.exe" "shell.powershell" "hook") | Out-String | ?{$_} | Invoke-Expression
}
#endregion

根本原因：PowerShell 启动时会尝试执行该初始化脚本，导致长时间等待。

解决方案

实现 Conda 延迟加载

为了在保持快速启动的同时仍能使用 Conda，实现延迟加载机制，修改配置文件：

# C:\Users\Alaye\Documents\PowerShell\profile.ps1
# 简单的 Conda 延迟加载
function Invoke-CondaInit {
    if (-not $script:CondaAlreadyInitialized) {
        Write-Host "正在初始化 Conda..." -ForegroundColor Yellow
        If (Test-Path "D:\DevEnv\anaconda3\Scripts\conda.exe") {
            (& "D:\DevEnv\anaconda3\Scripts\conda.exe" "shell.powershell" "hook") | Out-String | Where-Object {$_} | Invoke-Expression
        }
        $script:CondaAlreadyInitialized = $true
    }
}

# 只有在使用 conda 相关命令时才初始化
Set-Alias -Name conda -Value conda-wrapper
function conda-wrapper {
    Invoke-CondaInit
    conda @args
}

性能优化效果

优化前：>5 秒
使用延迟加载：启动<1 秒，首次使用 conda 时延迟加载 (约 2-3 秒)

总结

现在的配置方案既能保证 PowerShell 快速启动，又能在需要时使用 Conda 环境。

关键原则：保持启动脚本的轻量化，将重量级功能改为按需加载，这是提升命令行启动响应速度的有效方法。

flutter_local_notifications 踩坑记录

Thu, 19 Jun 2025 00:00:00 GMT

仔细看官方文档很有用！

flutter_local_notifications | Flutter package

Android 配置

配置 build.gradle.kts

启用 desugaring（脱糖）

android {
    defaultConfig {
        multiDexEnabled = true
    }

    compileOptions {
        // Flag to enable support for the new language APIs
        // 1、启用Desugaring
        isCoreLibraryDesugaringEnabled = true
        // Sets Java compatibility to Java 11
        sourceCompatibility = JavaVersion.VERSION_11
        targetCompatibility = JavaVersion.VERSION_11
    }
  
    kotlinOptions {
        jvmTarget = JavaVersion.VERSION_11.toString()
    }
}

// 2、启用coreLibrary
dependencies {
    coreLibraryDesugaring("com.android.tools:desugar_jdk_libs:2.1.4")
}

配置 AndroidManifest.xml

<receiver android:exported="false" android:name="com.dexterous.flutterlocalnotifications.ScheduledNotificationReceiver" />
<receiver android:exported="false" android:name="com.dexterous.flutterlocalnotifications.ScheduledNotificationBootReceiver">
    <intent-filter>
        <action android:name="android.intent.action.BOOT_COMPLETED"/>
        <action android:name="android.intent.action.MY_PACKAGE_REPLACED"/>
        <action android:name="android.intent.action.QUICKBOOT_POWERON" />
        <action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/>
    </intent-filter>
</receiver>

请求通知权限（Android 13+）

FlutterLocalNotificationsPlugin flutterLocalNotificationsPlugin =
        FlutterLocalNotificationsPlugin();
flutterLocalNotificationsPlugin.resolvePlatformSpecificImplementation<
    AndroidFlutterLocalNotificationsPlugin>().requestNotificationsPermission();

常见问题

8 已过时、bigLargeIcon() 都匹配

报错信息如下：

Launching lib\main.dart on sdk gphone64 x86 64 in debug mode...
Running Gradle task 'assembleDebug'...
警告: [options] 源值 8 已过时，将在未来发行版中删除
警告: [options] 目标值 8 已过时，将在未来发行版中删除
警告: [options] 要隐藏有关已过时选项的警告, 请使用 -Xlint:-options。
C:\Users\Alaye\AppData\Local\Pub\Cache\hosted\pub.dev\flutter_local_notifications-16.3.3\android\src\main\java\com\dexterous\flutterlocalnotifications\FlutterLocalNotificationsPlugin.java:1033: 错误: 对bigLargeIcon的引用不明确
      bigPictureStyle.bigLargeIcon(null);
                     ^
  BigPictureStyle 中的方法 bigLargeIcon(Bitmap) 和 BigPictureStyle 中的方法 bigLargeIcon(Icon) 都匹配
1 个错误
3 个警告

FAILURE: Build failed with an exception.

这大概是因为包版本过低。

解决方法：

升级 flutter_local_notifications 版本，使用指令 flutter pub upgrade。

NDK 版本问题

【Flutter】在 Android NDK 中遇到错误时该怎么办 | HY Clear 博客 | hy clear blog

Tools - SDK Manager 下载所需版本的 NDK

NDK 项目版本和文件版本不一致：

Build file 'D:\Alaye\CODE\AndroidStudioProjects\exp3_notice_weather_info\android\build.gradle.kts' line: 16

- What went wrong:  
    A problem occurred configuring project ':app'.
    

> [CXX1104] NDK from ndk.dir at D:\DevEnv\Android\Sdk\ndk\29.0.13113456 had version [29.0.13113456] which disagrees with android.ndkVersion [26.3.11579264]

解决方法：

指定 NDK 版本及路径、修改 flutter 的文件。具体步骤可以看以上引用的文章。

IDEA 新建 Servlet 选项消失

Mon, 26 May 2025 00:00:00 GMT

引

实训课需要使用了 JSP - Servlet 的模式进行开发，在 IDEA 中新建文件却没有发现 Servlet 选项，但是老师和一些同学的旧版本中却有这个选项。

你是否也刚刚将你的 IntelliJ IDEA 升级到了最新版本，兴冲冲地准备开始你的 Java Web 项目，却在右键点击包名 -> "New" 时傻了眼——曾经熟悉的 "Servlet"、"Filter" 和 "Listener" 等选项竟然不见了？！

别担心，你不是一个人。这确实是 IntelliJ IDEA 近期版本的一个显著变化。本篇将为你揭示其中的原因，并提供清晰的解决方案。

变化的原因：JetBrains 的考量

根据 JetBrains 官方的说法 (主要在其 YouTrack 问题追踪系统中)，从 IntelliJ IDEA 2023.1 版本开始，开发团队移除了直接在 "New" 菜单中创建 Servlet、Web Filter 和 Web Listener 的选项。

主要原因包括：

使用频率降低： 随着现代 Java Web 框架（如 Spring MVC/Boot, Jakarta EE 自身的 JAX-RS 等）的普及，开发者越来越少直接通过 IDE 的向导来创建这些底层的 Servlet API 组件。框架通常会提供更高级的抽象和注解来处理请求和过滤器逻辑。
简化菜单： 移除不常用的选项有助于保持 "New" 菜单的简洁性。

虽然这一改变对于习惯了旧版操作的开发者来说可能有些突然，但创建这些组件的途径依然存在，只是方式略有不同。

如何在 IntelliJ IDEA 2023.1 及更高版本中创建 Servlet？

以下是目前推荐的几种方法：

1. 手动创建 Java 类 (推荐)

这是最直接也是最灵活的方式。

创建 Java 类：
- 在你的项目视图中，右键点击目标包（通常在 src/main/java 下）。
- 选择 New > Java Class。
- 输入你的类名，例如 MyCustomServlet。
继承相应的父类/实现接口：
- 对于 Servlet: 使你的类继承 jakarta.servlet.http.HttpServlet (对于 Jakarta EE 9+，如 Tomcat 10+) 或 javax.servlet.http.HttpServlet (对于旧版 Java EE，如 Tomcat 9 或更早)。
- 对于 Filter: 实现 jakarta.servlet.Filter 或 javax.servlet.Filter 接口。
- 对于 Listener: 实现相应的 Listener 接口，如 jakarta.servlet.ServletContextListener 或 javax.servlet.http.HttpSessionListener 等。
添加注解或配置 web.xml：
- 使用注解是现代 Jakarta EE/Java EE 的推荐方式。
  - Servlet: @WebServlet("/your-path")
  - Filter: @WebFilter("/your-path/*")
  - Listener: @WebListener
- 或者，你仍然可以在 webapp/WEB-INF/web.xml 文件中手动配置这些组件。

示例：创建一个 Jakarta EE Servlet

package com.example.web;

import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet(name = "MyCustomServlet", urlPatterns = {"/hello"})
public class MyCustomServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        resp.setContentType("text/html");
        resp.getWriter().println("<h1>Hello from MyCustomServlet!</h1>");
    }
}

2. 使用自定义文件模板

如果你需要频繁创建这些组件，自定义文件模板是一个非常高效的选择。

打开模板设置：
- 进入 File > Settings (或 IntelliJ IDEA > Settings/Preferences 在 macOS 上) > Editor > File and Code Templates。
在 Files 页创建新模板：
- 点击 + (Add) 按钮。
- Name: 给你的模板起一个描述性的名字，例如 "Jakarta Servlet"。
- Extension: java
- Template text: 粘贴你的 Servlet、Filter 或 Listener 的基本骨架代码。你可以使用预定义变量，如 ${PACKAGE_NAME} 和 ${NAME} (代表类名)。

[!TIP] 在 Other 页 Web - Java code templates 中可以找到 Servlet Class.java 等的模板，复制粘贴即可。

#if (${PACKAGE_NAME} && ${PACKAGE_NAME} != "")package ${PACKAGE_NAME};#end  
#parse("File Header.java")  
  
#if ($JAVAEE_TYPE == "jakarta")  
import jakarta.servlet.*;  
import jakarta.servlet.http.*;  
import jakarta.servlet.annotation.*;  
#else  
import javax.servlet.*;  
import javax.servlet.http.*;  
import javax.servlet.annotation.*;  
#end  
import java.io.IOException;  
  
@WebServlet(name = "${Entity_Name}", value = "/${Entity_Name}")  
public class ${Class_Name} extends HttpServlet {  
    @Override  
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
  
    }  
  
    @Override  
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
  
    }  
}

使用模板：
- 之后，在你的项目中右键点击包，选择 New > 你的模板名称 即可快速生成。

JetBrains 官方也鼓励用户通过这种方式自定义常用的代码结构。

来自 JetBrains 的官方信息

可以从 JetBrains 的官方渠道找到佐证：

YouTrack 问题 IDEA-309062 (JavaEE: Drop new Servlet, Web Filter and Web Listener actions): 明确记录了移除这些选项的决定，并提到“自 2023.1 版本起，我们不再提供这些模板，因为如今它们已很少被使用。”
- 链接: https://youtrack.jetbrains.com/issue/IDEA-309062
YouTrack 问题 IDEA-316701 (Cannot create servlet, web filter, web listener after 2023.1 update): 用户在更新后报告了此问题，JetBrains 员工确认了模板的移除，并建议使用自定义文件模板，甚至提供了移除前模板的内容供用户参考。
- 链接: https://youtrack.jetbrains.com/issue/IDEA-316701
IntelliJ IDEA 官方文档: 在关于创建 Web 应用程序元素的文档中，现在会说明 IntelliJ IDEA 不再提供这些组件的默认模板，并指导用户如何自己创建。
- 参考链接: https://www.jetbrains.com/help/idea/creating-and-configuring-web-application-elements.html

其他注意事项

项目依赖： 确保你的项目 (pom.xml 或 build.gradle) 中添加了正确的 Servlet API 依赖。

Jakarta EE 9+ (如 Tomcat 10+):

<dependency>
	<groupId>jakarta.servlet</groupId>
	<artifactId>jakarta.servlet-api</artifactId>
	<version>6.0.0</version> 
	<scope>provided</scope>
</dependency>

旧版 Java EE (如 Tomcat 9 及更早)

<dependency>
	<groupId>javax.servlet</groupId>
	<artifactId>javax.servlet-api</artifactId>
	<version>4.0.1</version>
	<scope>provided</scope>
</dependency>

总结

虽然 IntelliJ IDEA 移除了直接创建 Servlet、Filter 和 Listener 的菜单选项，但这并不意味着我们无法再创建它们。通过手动创建 Java 类并结合注解，或者利用强大的自定义文件模板功能，我们依然可以进行 Servlet 开发。

Python 中安装 mysqlclient

Thu, 22 May 2025 00:00:00 GMT

引

直接 pip install mysqlclient，安装报错：

	  ......
      building 'MySQLdb._mysql' extension
      error: Microsoft Visual C++ 14.0 or greater is required. Get it with "Microsoft C++ Build Tools": https://visualstudio.microsoft.com/visual-cpp-build-tools/
      [end of output]

  note: This error originates from a subprocess, and is likely not a problem with pip.
  ERROR: Failed building wheel for mysqlclient
Failed to build mysqlclient
ERROR: ERROR: Failed to build installable wheels for some pyproject.toml based projects (mysqlclient)

提示需要安装 Microsoft C++ Build Tools。

解决方法

以下两个方法选择一种即可。

安装 Microsoft C++ Build Tools

安装 Microsoft C++ 生成工具 - Visual Studio。安装过程中，请确保勾选了 C++ 生成工具（C++ Build Tools）组件。

使用预编译的二进制文件安装 mysqlclient

使用提供的预编译版本来安装，例如使用 wheel 提供的 .whl 文件进行安装。

访问 mysqlclient · PyPI，在 Built Distributions 中找到对应 Python 版本和系统及芯片架构的包。

这里例如需要下载的是 mysqlclient-2.2.7-cp312-cp312-win_amd64.whl ，将下载的文件临时放到命令行所访问的根路径下，使用命令安装：

(django) PS D:\Alaye\GitHubDesktop\Playground\django-vue3-admin\backend> 
pip install mysqlclient-2.2.7-cp312-cp312-win_amd64.whl

安装成功提示：

Processing d:\alaye\githubdesktop\playground\django-vue3-admin\backend\mysqlclient-2.2.7-cp312-cp312-win_amd64.whl
Installing collected packages: mysqlclient
  Attempting uninstall: mysqlclient
    Found existing installation: mysqlclient 2.2.4
    Uninstalling mysqlclient-2.2.4:
      Successfully uninstalled mysqlclient-2.2.4
Successfully installed mysqlclient-2.2.7

参考

Windows系统安装mysqlclient最详细教程_mysqlclient安装-CSDN博客

在 Springboot 项目中使用 JSP

Fri, 09 May 2025 00:00:00 GMT

在现代 Web 开发中，虽然前后端分离的开发方式或者 Thymeleaf、Freemarker 等模板引擎更为流行，但在某些传统项目或特殊环境（如部分企业、~~我大学的 SSM 课程作业~~）中，JSP（Java Server Pages）仍有一定的使用场景。本文将详细介绍如何在一个 Spring Boot 项目中配置并使用 JSP。

创建 Spring Boot 项目

你可以通过 Spring Initializr 创建一个基础的 Spring Boot 项目，选择以下依赖项：

Spring Web
或者手动添加相关依赖

创建完成后，导入 IDE（如 IntelliJ IDEA 或 Eclipse）进行后续开发。

[!TIP] IDEA 中集成了 Spring Initializr，新建项目时可以直接使用 Spring Initializr

引入 JSP 相关依赖

由于 Spring Boot 默认不支持 JSP，我们需要手动引入相关依赖。编辑 pom.xml 文件，添加以下内容：

<!-- 引入内嵌 Tomcat 对 JSP 的支持 -->
<dependency>
    <groupId>org.apache.tomcat.embed</groupId>
    <artifactId>tomcat-embed-jasper</artifactId>
</dependency>

<!-- JSTL 标签库支持 -->
<dependency>
    <groupId>javax.servlet</groupId>
    <artifactId>jstl</artifactId>
    <version>1.2</version>
</dependency>

如果对应的 Tomcat 版本为 10 及以上，则添加：

<!-- JSTL 标签库支持 -->
<dependency>  
    <groupId>org.glassfish.web</groupId>  
    <artifactId>jakarta.servlet.jsp.jstl</artifactId>  
    <version>2.0.0</version>  
</dependency>

[!NOTE] 查看和指定SpringBoot内嵌Tomcat的版本 - 牧之丨 - 博客园

配置 Web 资源目录与结构

Spring Boot 默认使用 resources/templates 来存放模板文件，但 JSP 必须放在 webapp/WEB-INF/jsp/ 目录下。你需要手动创建该目录结构，推荐 webapp/WEB-INF/jsp/。

IDEA 设置项目结构

在 IDEA 顶部导航栏，选择 文件 - 项目结构 - 项目设置 - Facet

配置 Web 资源目录 项目路径\src\main\webapp

添加部署描述符 web.xml , 路径 项目路径\src\main\webapp\WEB-INF\web.xml

配置视图解析器（application.yml）

在 application.yml 中配置 JSP 页面的前缀和后缀路径：

spring:
  mvc:
    view:
      prefix: /WEB-INF/jsp/
      suffix: .jsp

这样配置后，控制器返回的字符串会自动拼接为对应的 JSP 路径。

例如：

return "hello"; // 将映射到 /WEB-INF/jsp/hello.jsp

编写 Controller 示例

接下来我们写一个简单的控制器来测试 JSP 页面是否正常渲染。

package com.example.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class JspController {

    @GetMapping("/hello")
    public String sayHello(Model model) {
        model.addAttribute("message", "Hello from Spring Boot with JSP!");
        return "hello";
    }
}

创建 JSP 页面

在 src/main/webapp/WEB-INF/jsp/ 下创建 hello.jsp 文件：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Hello JSP</title>
</head>
<body>
    <h1>${message}</h1>
</body>
</html>

启动项目访问：http://localhost:8080/hello，你应该能看到页面成功展示消息。

总结

通过以上步骤，我们完成了在 Spring Boot 项目中集成 JSP 的全过程。

使用 Obsidian 打造高效博客写作工作流

Mon, 28 Apr 2025 00:00:00 GMT

为什么选择 Obsidian 管理技术博客？

在维护和更新博客时，我们大部分时间都在创作 Markdown 格式的内容。然而，使用 VS Code 或 WebStorm 等 IDE 进行纯文本编辑往往显得过于笨重 - 这些工具的 Markdown 支持通常比较基础，缺乏专为写作优化的功能。

Obsidian 提供了截然不同的体验：

专为 Markdown 设计的清爽界面
丰富的社区插件生态
卓越的本地文件管理能力
多平台同步支持

Obsidian 博客工作流核心优势

✨ 专业级 Markdown 体验

实时预览与源码模式自由切换
表格、数学公式等复杂格式的便捷输入
语法高亮与自动补全

🧩 强大的插件生态

图片处理：自动转换 WebP 格式，优化加载速度
附件管理：智能归类到指定文件夹
模板系统：快速生成标准化的博文结构及 YAML Front-matter
格式化工具：保持 Markdown 风格一致

🔄 无缝的版本控制

配置文件存储在 .obsidian 目录
可自定义 .gitignore 规则
完美适配 Git 工作流

快速上手指南

在 Obsidian 中选择 管理仓库，打开本地仓库，将一个本地文件夹作为仓库在 Obsidian 中打开
定位到博客源码中 Markdown 文章存储目录
开始享受流畅的写作体验！

小技巧：使用 Obsidian 移动端应用，使用插件配置好文件同步，随时随地捕捉灵感，保持创作连续性。

进阶配置建议

安装 Templater 插件管理博文模板
使用 Linter 插件自动格式化 Markdown
配置 Image Toolkit 优化图片管理

Windows 设置 Capslock 切换中英文输入

Sat, 08 Feb 2025 00:00:00 GMT

Windows 的默认中英文切换方式体验较差，Shift 键既用于切换大小写，又用于切换输入法，容易误触。而 macOS 的 CapsLock 方案——短按切换中英文，长按启用大写锁定——更加直观且减少误操作。

本文介绍如何使用 AutoHotkey 实现类似 macOS 的 CapsLock 中英文切换方式，让输入更高效。

安装 AutoHotkey

首先，下载并安装 AutoHotkey：

官网：AutoHotkey

安装完成后，继续进行 Windows 和 AutoHotkey 设置。

Windows 设置

在 Windows 中，需要调整一些输入法设置，以确保 AutoHotkey 脚本正常工作。

关闭微软拼音输入法的 Shift 切换中英文功能
- 设置 → 时间和语言 → 语言和区域 → 输入 → 微软拼音 → 键盘
- 取消勾选“Shift 切换中英文”
添加一个英文输入法
- 设置 → 时间和语言 → 语言和区域 → 添加语言
- 选择 English (United States) 或其他需要的英文键盘

AutoHotkey 设置

创建 AutoHotkey 脚本

安装 AutoHotkey 后，右键桌面 → 新建 → AutoHotkey Script
右键新建的脚本文件，选择 编辑
替换内容为以下脚本：

使用 CapsLock 切换中英文输入法

#Requires AutoHotkey v2.0
#SingleInstance Force

; 让脚本在后台持续运行
Persistent

CapsLock::
{
    if (KeyWait("CapsLock", "T0.5")) {
        ; 短按 CapsLock 切换中英文
        Send "{Alt Down}{Shift Down}{Alt Up}{Shift Up}"
    } else {
        ; 长按 CapsLock 进行大小写锁定
        SetCapsLockState !GetKeyState("CapsLock", "T")
    }
}

锁定中文输入法的中文输入模式

为了确保中文输入法默认处于中文输入模式，可以使用以下脚本：

来源：gist.github.com

#Include %A_ScriptDir%

timeInterval := 500

InChs() {
  ime_status := DllCall("GetKeyboardLayout", "int", 0, "UInt")
  return (ime_status & 0xffff) = 0x804 ; LANGID(Chinese) = 0x804
}

SwitchImeState(id) {
  SendMessage(0x283,  ; WM_IME_CONTROL
              0x002,  ; wParam IMC_SETCONVERSIONMODE
              1025,   ; lParam (Chinese)
              ,       ; Control (Window)
              id)
}

DetectHiddenWindows True

SetTimer Mainloop, 1000

MainLoop() {
  try {
    hWnd := WinGetID("A")
    id := DllCall("imm32\ImmGetDefaultIMEWnd", "Uint", hWnd, "Uint")

    if (InChs()) {
      SwitchImeState(id)
    }
  }
}

设置脚本开机自启动

为了让脚本每次开机后自动运行，可以将其转换为 .exe 文件，并放入 Windows 启动目录。

转换 AutoHotkey 脚本为可执行文件

在 AutoHotkey Dash 中找到 Compile Open Ahk2Exe - convert .ahk to .exe
选择你的 .ahk 脚本，将其编译为 .exe

生成的 .exe 文件移动至：

C:\ProgramData\Microsoft\Windows\Start Menu\Programs\StartUp

这样，每次 Windows 启动时，脚本都会自动运行，无需手动执行。

总结

通过 AutoHotkey，我们可以实现 CapsLock 短按切换中英文，长按启用大写锁定，从而改善 Windows 输入体验。搭配锁定中文输入模式的脚本，可以确保中文输入法默认保持中文输入。

参考资料

ERA 提问模式：提升 AI 交互效率

Thu, 06 Feb 2025 00:00:00 GMT

如何让 AI 给出更精准、更有价值的回答？

在与大模型（如 ChatGPT）交流时，提问的方式决定了回答的质量。本文将介绍 ERA 提问模式（Expectation - Role - Action），帮助你高效获取 AI 生成的优质内容。

什么是 ERA 提问模式？

ERA 代表 Expectation（期望）- Role（角色）- Action（行动），它是一个高效提问的框架，可以让你的问题更加精准，让 AI 的回答更符合你的需求。

1. Expectation（期望）

明确你的提问目标，让 AI 知道你希望得到什么类型的回答。

✅ 好的示例：

" 请用通俗易懂的语言解释什么是机器学习，并举例说明。"
❌ 不清晰的示例：

" 机器学习是什么？"

2. Role（角色）

设定 AI 的身份，让回答更符合你的实际需求。

✅ 好的示例：

" 假设你是一名资深 Python 工程师，请讲解 asyncio 的核心概念。"
❌ 不清晰的示例：

"asyncio 是什么？"

3. Action（行动）

指定 AI 需要执行的具体任务或输出格式。

✅ 好的示例：

" 请用 Markdown 格式输出一篇关于 Vue 3 Pinia 的入门教程，包含代码示例。"
❌ 不清晰的示例：

" 讲讲 Vue 3 Pinia。"

ERA 提问模式示例

🚀 优化前：

"Vue 3 的 Pinia 怎么用？"

✅ 优化后（使用 ERA 框架）：

" 请你以 Vue 3 高级开发者的身份，讲解 Pinia 在状态管理中的优势，并提供完整的 Vue 3 代码示例。"

Expectation（期望）：讲解 Pinia 的优势，并提供代码示例。
Role（角色）：Vue 3 高级开发者。
Action（行动）：提供完整的 Vue 3 代码示例。

ERA 提问模式模板

你可以使用以下模板来快速构造你的问题：

请你以【角色】的身份，针对【目标对象】讲解【主题】，并提供【具体行动或格式】。

✅ 示例：

" 请你以 AI 研究员的身份，分析 GPT-4 在自然语言处理中的局限性，并用表格展示优缺点。"
" 假设你是一名产品经理，如何向客户解释 AI 生成式模型的商业价值？"
" 作为一名 Java 开发者，如何使用 Spring Boot 构建 REST API？请提供示例代码。"

结论

使用 ERA 提问模式，你可以： ✅ 提高 AI 回答的准确性。 ✅ 让 AI 站在符合你需求的角度回答。 ✅ 让回答更具有可操作性，减少模糊性。

下次向 AI 提问时，不妨试试 ERA 模式，你会发现 AI 的回答变得更加精准和实用！🚀

资料

提示工程学习必备 | 最全面的提示框架整理 | 15组-AI仓鼠洞

Windows PC 扬声器异常低哑

Fri, 31 Jan 2025 00:00:00 GMT

最近发现笔记本扬声器音质变得很奇怪，声音低哑，听起来就像在打蓝牙电话。排查了一下，原来是 Elevoc Audio Effects Component 惹的祸。

快速解决方法

打开 设备管理器。
找到 音频处理对象(APO)。
找到 Elevoc Audio Effects Component，右键选择禁用或者直接卸载。

它到底是什么？

这个组件是 Elevoc 推出的音频增强工具，通常是通过 Windows 更新安装的，号称可以优化音质、降噪。但有时候它会和系统的音频配置发生冲突，结果反而让声音变得很糟糕。

如果卸载后又回来了怎么办？

Windows 更新可能会再次安装这个组件，所以光卸载可能不够用。这时可以选择以下方法：

禁用组件 直接禁用 Elevoc Audio Effects Component 就好。操作步骤和卸载一样，右键点击后选择“禁用”。禁用后，系统就不会加载它了。
阻止它的更新 用微软的 " 显示或隐藏更新工具 "（Show or Hide Updates Tool）来屏蔽相关更新。
- 这个工具可以在微软官网找到。
- 下载后运行，选择“隐藏更新”，然后把和 Elevoc 相关的更新屏蔽掉。
回滚驱动版本 如果你觉得还是不对劲，可以试着回滚到之前的音频驱动。
- 在 设备管理器 里找到你的音频设备，右键属性。
- 点击“驱动程序”选项卡，选择“回滚驱动程序”。

最后

虽然 Elevoc Audio Effects Component 本意是提升音质，但如果遇到不兼容的问题，最简单的办法就是禁用或卸载它。如果不想它再捣乱，禁用和屏蔽更新是目前最有效的办法。

疑惑

在禁用 Elevoc Audio Effects Component 之后，外放暂时就正常了，但重启电脑之后，还是会复现扬声器音质异常低哑的问题，~~这时再 启用，外放就又正常了。所以目前的解决方式就是 禁用/启用 ，还是没有找到具体的原因和优雅的解决方法，待研究。~~

续

在网络中搜索了一下，发现类似的问题是因为使用了联想的会议扬声器降噪功能，但是奇怪的一点是我并没有在电脑上启用类似的功能也没有类似的开关。尝试直接禁用服务，在Windows服务中搜索Elevoc Control Service，选择右键属性，在启动类型中选择禁用，解决！

利用 Github Actions 构建并部署项目到云服务器

Wed, 22 Jan 2025 00:00:00 GMT

引

本教程将介绍如何通过 GitHub Actions 编译 Astro 项目，并将静态文件通过 SCP 推送到云服务器。虽然是 Astro 项目，但是其他项目的部署也是相通的，改一下脚本就好，有一定参考性。

月初为了自部署 Obsidian 的实时同步，在阿里云购入了服务器和域名，想着既然买都买了，那就正好重建一下博客吧，看来看去选用了 Astro 的 Fuwari 。但是部署到自己服务器时出现了一点问题，服务器是 2 核 2G 的，直接在服务器上编译静态文件再部署，在编译过程中因为服务器配置弱鸡直接就卡崩了，所以就只能在本地笔记本上编译好再把文件发送到服务器上，但是这样也很麻烦，需要手动本地重复编译和上传文件到服务器，于是就开始探究更优雅的方法。最后发现可以使用 Github Actions 来实现当仓库有新的推送时触发自动编译（由 Github 的服务器）和上传得到的静态文件到服务器。

准备工作

1. 生成 SSH 密钥对

在本地生成一对 SSH 密钥，用于 GitHub Actions 和服务器的连接。

ssh-keygen -t rsa -b 4096 -C "github-actions"

保存路径建议为 ~/.ssh/github_actions_key。
公钥文件：github_actions_key.pub。
私钥文件：github_actions_key。

2. 配置服务器

将生成的公钥添加到服务器的 ~/.ssh/authorized_keys 文件中：

echo "你的公钥内容" >> ~/.ssh/authorized_keys
chmod 700 ~/.ssh
chmod 600 ~/.ssh/authorized_keys

确认 SSH 服务正常运行：

sudo systemctl status sshd

3. 配置 GitHub Secrets

将以下信息添加到 GitHub 仓库的 Settings > Secrets and variables > Actions > New repository secret：

Secret 名称	内容
`SERVER_KEY`	私钥内容 (`github_actions_key`)
`SERVER_HOST`	服务器 IP 或域名
`SERVER_USER`	SSH 用户名
`SERVER_PORT`	SSH 端口（默认 22）

GitHub Actions 工作流文件

创建工作流文件 .github/workflows/deploy.yml：

name: Deploy Astro to Cloud Server

on:
  push:
    branches:
      - main  # 监控 main 分支的推送事件

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      # Step 1: 检出代码
      - name: Checkout code
        uses: actions/checkout@v3

      # Step 2: 设置 Node.js 环境
      - name: Setup Node
        uses: actions/setup-node@v4
        with:
          node-version: "20"
          cache: ${{ steps.detect-package-manager.outputs.manager }}
          cache-dependency-path: ${{ env.BUILD_PATH }}/${{ steps.detect-package-manager.outputs.lockfile }}

      # Step 3: 安装 pnpm
      - name: Install pnpm
        run: npm install -g pnpm

      # Step 4: 安装依赖并构建
      - name: Install dependencies and build
        run: |
          pnpm install       # 安装依赖
          pnpm run build     # 构建 Astro 项目

      # Step 5: 将静态文件推送到云服务器
      - name: Deploy to Cloud Server
        uses: appleboy/scp-action@v0.1.7
        with:
          host: ${{ secrets.SERVER_HOST }}       # 云服务器 IP 或域名
          username: ${{ secrets.SERVER_USER }}   # SSH 用户名
          key: ${{ secrets.SERVER_KEY }}         # 私钥
          port: ${{ secrets.SERVER_PORT }}       # SSH 端口
          source: dist/                          # Astro 输出目录
          target: /www/wwwroot/blog-astro-fuwari/          # 部署到服务器的路径

常见问题与排查

1. SSH 连接失败

错误信息：Permission denied (publickey)
- 检查服务器是否正确配置了公钥。
- 确保私钥权限为 600 且对目标文件夹具有写入权限。
错误信息：ssh: handshake failed: connection reset by peer
- 检查服务器防火墙规则，确保允许 SSH 端口（默认 22）。
- 确保服务器的 SSH 服务正在运行：
```
sudo systemctl status sshd
```

2. SCP 文件上传失败

错误信息：No such file or directory
- 确认目标路径 /var/www/html/astro/ 是否存在，必要时创建：
```
mkdir -p /var/www/html/astro/
```

3. GitHub Secrets 配置问题

新建一个用于测试的 Action，在 Actions 日志中调试 Secrets 是否正确：

name: Test GitHub Secrets

on:
  workflow_dispatch: # 手动触发工作流

jobs:
  test-secrets:
    runs-on: ubuntu-latest

    steps:
      # Step 1: 检出代码
      - name: Checkout code
        uses: actions/checkout@v3

      # Step 2: 创建 SSH 配置文件
      - name: Setup SSH Key
        run: |
          mkdir -p ~/.ssh
          echo "${{ secrets.SERVER_KEY }}" > ~/.ssh/id_rsa
          chmod 600 ~/.ssh/id_rsa
          echo -e "Host test-server\n  HostName ${{ secrets.SERVER_HOST }}\n  User ${{ secrets.SERVER_USER }}\n  IdentityFile ~/.ssh/id_rsa\n  StrictHostKeyChecking no" > ~/.ssh/config
          chmod 600 ~/.ssh/config

      # Step 3: 测试 SSH 连接
      - name: Test SSH Connection
        run: ssh test-server "echo 'SSH Connection Successful!'"

      # Step 4: 输出测试结果
      - name: Report Success
        if: success()
        run: echo "Secrets are configured correctly!"

参考资料

给计算机专业准大一新生的一些建议

Wed, 07 Aug 2024 00:00:00 GMT

引

写文时间，已经是 8 月，大部分的同学已经收到了自己的录取通知书，知道了自己录取的学校及专业。无论如何，祝贺大家，即将踏入计算机专业的学习之路。距离开学还有一段时间，大家可以在娱乐之余，提前为之后的专业学习做一些准备，这里根据我的经历，分享一些的经验及 tips，希望可以帮到大家。🤔

既来则安

专业已是既定事实，先坦然接受，学习一段时间再下定论。不过大部分学校还是可以在学校里转专业的，如果在学习了一段时间之后确实觉得计算机对于自己来说不合适，可以向学校申请转专业，每个学校的转专业政策不同，这个具体需要向学校或者是辅导员咨询。

买电脑

巧妇难为无米之炊。对于计算机专业的同学来说，买电脑是必要的。

条件允许的话，建议尽早购买。可能很多同学在大学之前很少用过电脑，甚至没有用过电脑，所以可以在正式入学之前买好电脑，提前熟悉电脑的基本操作，~~闲暇之余还能玩游戏看剧，犒劳一下经历完高考的自己~~。具体选型可以去 B 站看一些评测，如果对笔记本电脑硬件完全不了解，也有小白向的介绍。

如果有游戏需求的话，建议买带独立显卡的笔记本，满足游戏需求的同时，还能用显卡尝试学习了解一些最近比较火的 AI 应用，比如 AI 生图。

学习编程语言

可以提前学习一门基础编程语言，例如 C、Python 等等。了解一些计算机专业的基础知识。我学习的第一门语言是 C 语言。看的是翁恺老师的课，对于入门来说非常不错，这里推荐给大家 C语言程序设计_浙江大学_中国大学MOOC(慕课)

加入一个技术向社团

社团是大学生活中的一个有趣部分。可以去了解一下学校里的社团主要有哪些、是干什么的。一般大学中都能找到有组织参与学科竞赛的技术向社团，了解清楚情况后，可以选择加入一个，既可以有学习锻炼技术的机会，还能认识同样对技术有热情的朋友。

自学

就目前的环境来说，大部分大学的计算机课程是基础的引入，计算机的世界太丰富多彩了，学校是教不完的，也难以跟上行业发展。所以计算机专业，自学很重要，千万不要认为每天上完课，就可以回宿舍娱乐了。互联网时代，网络上的学习资源有很多，B 站、慕课等等都是很好的找视频课程的地方。

资源推荐

dazidazi-在线打字练习键盘是计算机专业吃饭的筷子，代码可以写的不快，但是敲键盘一定要帅😎
Github 全球最大的代码托管平台，可以在上面找到很多有趣的开源项目

关闭 QQ 音乐 P2P

Sat, 03 Aug 2024 00:00:00 GMT

引

最近 C 盘有点告急,刚好整理一下电脑上的文件, 通过 SpaceSniffer 可以以图形大小的形式查看和反映磁盘上各文件的大小,发现 QQ 音乐缓存文件占了很大的一块,起初还以为只是平常的听歌缓存,后仔细翻看文件夹,观察文件夹命名发现是 QQ 音乐 P2P 下载的缓存,占用高达 17GB🥲所以就禁用了 QQ 音乐 P2P 下载.

教程

附上教程

禁止QQ音乐后台上传教程

刚好前两天看到一期视频讲到了 P2P

【X.PIN】偷你流量还断你家网，视频平台和运营商打架，把消费者干成了小丑。。。

VSCode 与 Keil 协同嵌入式开发

Tue, 23 Jul 2024 00:00:00 GMT

引言

Keil是嵌入式开发中常用的 IDE，但是Keil没有方便的自动补全、代码重构、自由度高的插件等功能，代码的编辑体验很难比拟VSCode的现代化。通过VSCode中插件的能力，可以使VSCode调用Keil的编译器进行编译，并直接在VSCode的内置控制台中显示报错信息和错误代码行跳转，实现一站式编辑&编译是替代方案，提高了嵌入式开发效率。

先前条件

已经安装了VSCode和Keil
已经配置好Keil的 License
可以使用 Keil 直接进行代码编辑和编译

VSCode和Keil的安装与基础配置，网络上已经有很多教程，可自行搜索，这里不再赘述。

[!TIP] VSCode：下载地址

Keil：下载地址

安装和配置Keil uVision Assistant

打开VSCode，点击 扩展 图标，搜索 Keil uVision Assistant，安装该插件并启用。

[!IMPORTANT] 这里搜索结果可能会出现两个名字类似的插件，这里做出解释：Keil Assistant 已于 Jun 13, 2021 归档转为只读。Keil uVision Assistant 是 Keil Assistant 的后续版本，由另外一个开发者 jacksonjim 负责继续更新及维护。

点击插件右侧的 ⚙️-拓展设置 根据所开发的单片机芯片的架构和Keil的安装目录，完成插件的基础配置。

键 为单片机芯片的架构，值 为Keil的安装目录。如果忘记了Keil的安装目录，可以在桌面右键 Keil uVision-快捷方式，然后 打开文件所在的位置，再从当前的文件夹位置往上回退一级，定位到包含 UV4.exe 所在的的 UV4 文件夹即可。如图情况所示，对应的 值 为 C:\Keil_v5。

开始使用

使用VSCode打开一个项目文件夹，就可以在VSCode中直接进行代码编辑和编译了。Keil uVision Assistant的 README.md 中有详细的使用教程，可以参考。

Keil Assistant README.md

补充

自动 Open Project

使用 Keil uVision Assistant 插件进行开发，如果 .uvprj 文件不在项目的一级子文件夹中，插件将无法自动识别到 .uvprj 文件，每次打开VSCode写项目代码时都需要手动指定 .uvprj 文件地址，进行重复的 Open Project 的操作，不够优雅。

其实Keil uVision Assistant 插件中有一项 File Location List 设置，可以添加 .uvprj 文件所在的文件夹路径，这样每次打开项目文件夹时插件就会自动识别到 .uvprj 文件，搭配VSCode的 workspace 功能，体验更佳。

添加/删除项目源文件

利用Keil uVision Assistant插件在VSCode中进行代码编译，原理是通过调用Keil的编译器实现的，所以Keil 的安装是必须的。并且给项目添加/删除的源文件也必须回到Keil,

注意

编码格式及中文注释乱码

Keil原因，使用中文注释必须使用 GB2312 编码，所以为了避免出现注释乱码同时保持Keil编辑的可读兼容性。可以在VSCode中进行对应的设置。

打开VSCode设置，搜索 encoding，勾选 Auto Guess Encoding，在 Candidate Guess Encoding 中依次添加 gb2312、utf8。

C51/C251 的中断提示问题

使用 Keil uVision Assistant 插件进行开发，但是 C51/C251 项目中 中断函数 的 interrupt x（x 代表中断号即一个数字）会导致VSCode语法分析报错，这是因为VSCode的语法分析是基于标准 C 语言的，标准 C 语言中没有 中断函数 的 interrupt x 的语法。

所以需要在代码头文件通过宏定义进行修复，具体请参照关于 C51/C251 的中断提示问题。将所有 interrupt x 改为 INTERRUPT(x) 并在头文件中加入对应芯片架构的替换修复的宏定义。

[!WARNING] 如果项目涉及到日后的他人维护，为避免产生不必要的不解或错误，注意在代码中对于解决本问题做出的修改进行必要的注释。

中断函数修改

一般的中断函数：

void TM0_Isr() interrupt 1
{
}

修改后的中断函数：

void TM0_Isr() INTERRUPT(1)
{
}

头文件修改

在头文件中加入对应芯片架构的替换修复的宏定义：

对于C51：

#ifndef __VSCODE_C51__
#define INTERRUPT(x) interrupt x
#else
#define INTERRUPT(x)
#endif

对于C251：

#ifndef __VSCODE_C251__
#define INTERRUPT(x) interrupt x
#else
#define INTERRUPT(x)
#endif

END

修改 Windows 任务栏字体颜色

Thu, 13 Jun 2024 00:00:00 GMT

使用场景

Windows 并不会去根据任务栏背景色吊改变字体颜色，当使用例如 TranslucentTB，在一些背景下，导致任务栏暗色时，默认字体显示仍为黑色，导致观察困难，可读性差。所以可以通过修改注册表改变任务栏默认字体颜色。

修改注册表

新建一个.txt 文件，打开记事本，复制以下内容，粘贴到记事本中，保存为.reg 文件，双击打开，即可修改注册表。

Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Themes\Personalize]
"ColorPrevalence"=dword:00000002

修改完成后，需要在任务管理器中，重启资源管理器，即可生效。若仍然无效可以尝试重启。

回归默认设置

类似之前的方法，将 ColorPrevalence 的值设置为 0，再双击打开.reg 文件修改。

Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Themes\Personalize]
"ColorPrevalence"=dword:00000000

符号链接

Wed, 05 Jun 2024 00:00:00 GMT

什么是符号链接

符号链接，又常被称为软链接，是现代操作系统中（如 Linux、macOS 及 Windows 的新版本）提供的一种高级文件系统特性。它实质上是一个特殊类型的文件，其功能在于指向文件系统中另一个文件或目录的位置。下面是关于符号链接的几个核心概念：

特性概览

路径表示：符号链接内的路径可以是绝对的，直接指向文件系统的特定位置；也可以是相对的，基于链接所在目录来定位目标。
透明操作：用户和应用程序对符号链接进行读写操作时，操作系统会无缝地重定向这些操作至目标文件或目录，保证了使用的透明性。
独立存在：虽然服务于指向其他文件或目录，符号链接本身作为文件系统中的独立实体存在，拥有自己的属性和权限设置。删除链接不影响原文件。
目录兼容：支持创建指向文件或目录的链接，大大增强了文件系统的灵活性和组织能力。
动态性与稳定性：目标文件的移动或重命名不会自动更新符号链接，可能导致链接失效，但同时也意味着链接可以独立于目标存在。
循环与复杂结构：在理论上，符号链接可以构成循环引用，即链接指向自己或其他链接，类似于编程中的递归结构。
跨文件系统：与硬链接相比，符号链接的一大优势是可以跨越不同的文件系统边界，指向其他分区或网络位置的文件。
权限管理：符号链接自身的权限控制独立于目标对象，为安全管理和访问控制提供了额外的灵活性。

应用场景

路径简化：通过创建简短或逻辑清晰的链接路径，便于用户和程序快速访问深层或复杂的文件结构。
快捷方式：类似 Windows 的快捷方式功能，为频繁访问的文件或目录提供便捷入口。
数据共享：实现文件共享的同时，无需复制文件，节省存储空间并保持数据一致性。
系统配置与部署：动态调整系统配置，特别是在开发环境中，符号链接可以帮助快速切换不同的项目版本或资源。

通过上述介绍，可以看出符号链接是提升文件系统灵活性和效率的重要工具，广泛应用于各种操作系统和应用场景中。

目标

本教程指导您在 Windows 操作系统中利用命令行工具 mklink，创建指向特定文件的相对路径符号链接。确保即使源文件夹位置变动，该链接依旧保持有效。

准备工作

操作系统要求：适用于 Windows 系统。
管理员权限：确保拥有足够的权限来执行创建符号链接的操作。
命令行工具：打开“命令提示符（管理员）”或“Windows PowerShell（管理员）”。

操作步骤

1. 导航至工作目录

打开命令行工具：按 Win + X，选择“命令提示符（管理员）”或“Windows PowerShell（管理员）”。
切换目录：使用 cd 命令进入您打算创建符号链接的目录。例如，若目录为 D:\Alaye\GitHubDesktop\SmartCar_BST_Epoilt_Copy，输入：
```
cd /d D:\Alaye\GitHubDesktop\SmartCar_BST_Epoilt_Copy
```

2. 创建符号链接

执行命令：使用 mklink 命令创建指向目标文件的相对路径符号链接。假设目标文件为 D:\Alaye\GitHubDesktop\SmartCar_BST_Epoilt_Copy\STC32F_Code\Project\MDK\EPOILT.uvproj，并在当前 D:\Alaye\GitHubDesktop\SmartCar_BST_Epoilt_Copy 目录下创建同名链接，命令如下：
```
mklink "EPOILT.uvproj" ".\STC32F_Code\Project\MDK\EPOILT.uvproj"
```
其中，“EPOILT.uvproj”是新创建的链接名称，而 .\STC32F_Code\Project\MDK\EPOILT.uvproj 表示从当前目录出发的相对路径。

3. 验证与测试

成功执行命令后，检查当前目录下是否出现了新的符号链接文件，无错误提示表示创建成功。
双击新创建的链接，确认是否能顺利打开目标文件。

注意事项

权限考量：务必使用管理员模式运行命令行工具，否则可能因权限不足无法创建符号链接。
相对路径优势：采用相对路径使得符号链接在文件夹整体迁移时更加灵活可靠。
安全操作：操作前，建议备份重要数据，以防操作失误导致数据丢失。

通过上述步骤，可以高效地利用相对路径符号链接来优化文件和目录的组织方式，提高工作效率。

Markdown Extended Features

Wed, 01 May 2024 00:00:00 GMT

GitHub Repository Cards

You can add dynamic cards that link to GitHub repositories, on page load, the repository information is pulled from the GitHub API.

::github{repo="Fabrizz/MMM-OnSpotify"}

Create a GitHub repository card with the code ::github{repo="<owner>/<repo>"}.

::github{repo="saicaca/fuwari"}

Admonitions

Following types of admonitions are supported: note tip important warning caution

:::note Highlights information that users should take into account, even when skimming. :::

:::tip Optional information to help a user be more successful. :::

:::important Crucial information necessary for users to succeed. :::

:::warning Critical content demanding immediate user attention due to potential risks. :::

:::caution Negative potential consequences of an action. :::

Basic Syntax

:::note
Highlights information that users should take into account, even when skimming.
:::

:::tip
Optional information to help a user be more successful.
:::

Custom Titles

The title of the admonition can be customized.

:::note[MY CUSTOM TITLE] This is a note with a custom title. :::

:::note[MY CUSTOM TITLE]
This is a note with a custom title.
:::

GitHub Syntax

[!TIP] The GitHub syntax is also supported.

> [!NOTE]
> The GitHub syntax is also supported.

> [!TIP]
> The GitHub syntax is also supported.

Spoiler

You can add spoilers to your text. The text also supports Markdown syntax.

The content :spoiler[is hidden ayyy]!

The content :spoiler[is hidden **ayyy**]!

搭建 Jekyll 开发环境实现本地预览

Fri, 26 Apr 2024 00:00:00 GMT

为什么选 Jeklly

Jeklly 的一个最好的特点是『关注 blog 本身』。这是指什么呢？简单的说就是写博客的过程被铸造进了 Jekyll 的功能中。你只需简单的管理你电脑中的一个文件夹下的文本文件就可以写文章并方便的在线上发布。与繁琐的配置和维护数据库和基于网站的内容管理系统 (CMS) 相比，这是一个非常受欢迎的改变。

安装 Jekyll

事先准备

Ruby（including development headers, Jekyll 2 需要 v1.9.3 及以上版本，Jekyll 3 需要 v2 及以上版本）

RubyGems

Linux, Un ix, or Mac OS X

NodeJS, 或其他 JavaScript 运行环境（Jekyll 2 或更早版本需要 CoffeeScript 支持）。

Python 2.7（Jekyll 2 或更早版本）

官方文档没有说 Windows，不过 Windows 设备也可以安装。并且一般情况我们都是安装 Jekyll3 及以上的版本，所以我们需要准备的可以是这些：

Ruby
RubyGems
Windows，Linux, Unix, Mac OS X 系统中的其中一种（以下教程都以 Windows 为例）
NodeJS

安装 Ruby、RubyGems

进入 Ruby 官网，选择对应的安装方式，Windows 设备选 RubyInstaller，并下载安装。

Ruby+Devkit 中包含了 Ruby 和 RubyGems，下载并安装 Ruby+Devkit。

命令行中分别输入 ruby -v 和 gem -v 查看版本，确认安装完成。

安装完成后，会自动弹出 cmd.exe。如下图所示，提示安装 MSYS2，它是用来编译 Ruby 本地包的，我们需要手动输入 [1,2,3]，然后回车进行安装。由于网络的原因，可能会安装极慢，甚至安装失败，但是这是必须的步骤，只能多试几次，或者“爬高一点”。这里如果没有弹出命令行 MSYS2 安装界面或者把它关掉了，那么可以重新打开 cmd 命令行，输入 ridk install 来再次进入 MSYS2 安装界面。

安装 NodeJS

进入 NodeJS 官网，点击 Download 即可然后安装即可，没有什么特别的需要注意的地方，略过。

正式安装

使用 gem 安装 Jekyll：

gem install jekyll

这样就把 jekyll 安装完成了。

本地 Server

项目文件夹启动命令行

相关命令只能在一个含有 Gemfile 的目录下执行，如项目的根目录。在项目所在的文件夹进入 cmd。在项目文件夹文件管理器地址栏输入 cmd 并回车。

命令行显示的项目文件夹的地址即可。

安装 bundle

Rails 3 中引入 Bundle 来管理项目中所有 gem 依赖，所以首先我们需要安装 bundle。

安装 webrick 模块

webrick 是 Ruby 的 web 服务器模块，从 Ruby 3.0 开始 webrick 已经不再绑定到 Ruby 中了，请参考链接： Ruby 3.0.0 Released 中的说明，webrick 需要手动进行添加。

添加的命令为：

bundle add webrick

手动进行添加 webrick：

bundle add webrick

启动 server

启动本地 server：

jekyll server

将地址复制粘贴到浏览器，访问生成的本地地址：

成功，大功告成~

配置启动命令文件

为了方便启动 jekyll server 和调试，可以编写一个命令执行文件，之后可以直接双击运行。

start http://127.0.0.1:4000/
jekyll serve --livereload

start http://127.0.0.1:4000/ 启动浏览器并打开本地网址

--livereload 在源文件更新后自动刷新本地预览网页 {: .prompt-tip }

参考引用：

https://jekyllcn.com/docs/home/

https://zhuanlan.zhihu.com/p/139567128

https://zhuanlan.zhihu.com/p/426510048

https://dovesandy.github.io/2020/03/12/jekyll-start-jekyll-error/

Expressive Code Example

Wed, 10 Apr 2024 00:00:00 GMT

Here, we'll explore how code blocks look using Expressive Code. The provided examples are based on the official documentation, which you can refer to for further details.

Expressive Code

Syntax Highlighting

Regular syntax highlighting

console.log('This code is syntax highlighted!')

Rendering ANSI escape sequences

ANSI colors:
- Regular: [31mRed[0m [32mGreen[0m [33mYellow[0m [34mBlue[0m [35mMagenta[0m [36mCyan[0m
- Bold:    [1;31mRed[0m [1;32mGreen[0m [1;33mYellow[0m [1;34mBlue[0m [1;35mMagenta[0m [1;36mCyan[0m
- Dimmed:  [2;31mRed[0m [2;32mGreen[0m [2;33mYellow[0m [2;34mBlue[0m [2;35mMagenta[0m [2;36mCyan[0m

256 colors (showing colors 160-177):
[38;5;160m160 [38;5;161m161 [38;5;162m162 [38;5;163m163 [38;5;164m164 [38;5;165m165[0m
[38;5;166m166 [38;5;167m167 [38;5;168m168 [38;5;169m169 [38;5;170m170 [38;5;171m171[0m
[38;5;172m172 [38;5;173m173 [38;5;174m174 [38;5;175m175 [38;5;176m176 [38;5;177m177[0m

Full RGB colors:
[38;2;34;139;34mForestGreen - RGB(34, 139, 34)[0m

Text formatting: [1mBold[0m [2mDimmed[0m [3mItalic[0m [4mUnderline[0m

Editor & Terminal Frames

Code editor frames

console.log('Title attribute example')

<!-- src/content/index.html -->
<div>File name comment example</div>

Terminal frames

echo "This terminal frame has no title"

Write-Output "This one has a title!"

Overriding frame types

echo "Look ma, no frame!"

# Without overriding, this would be a terminal frame
function Watch-Tail { Get-Content -Tail 20 -Wait $args }
New-Alias tail Watch-Tail

Text & Line Markers

Marking full lines & line ranges

// Line 1 - targeted by line number
// Line 2
// Line 3
// Line 4 - targeted by line number
// Line 5
// Line 6
// Line 7 - targeted by range "7-8"
// Line 8 - targeted by range "7-8"

Selecting line marker types (mark, ins, del)

function demo() {
  console.log('this line is marked as deleted')
  // This line and the next one are marked as inserted
  console.log('this is the second inserted line')

  return 'this line uses the neutral default marker type'
}

Adding labels to line markers

// labeled-line-markers.jsx
<button
  role="button"
  {...props}
  value={value}
  className={buttonClassName}
  disabled={disabled}
  active={active}
>
  {children &&
    !active &&
    (typeof children === 'string' ? <span>{children}</span> : children)}
</button>

Adding long labels on their own lines

// labeled-line-markers.jsx
<button
  role="button"
  {...props}

  value={value}
  className={buttonClassName}

  disabled={disabled}
  active={active}
>

  {children &&
    !active &&
    (typeof children === 'string' ? <span>{children}</span> : children)}
</button>

Using diff-like syntax

+this line will be marked as inserted
-this line will be marked as deleted
this is a regular line

--- a/README.md
+++ b/README.md
@@ -1,3 +1,4 @@
+this is an actual diff file
-all contents will remain unmodified
 no whitespace will be removed either

Combining syntax highlighting with diff-like syntax

  function thisIsJavaScript() {
    // This entire block gets highlighted as JavaScript,
    // and we can still add diff markers to it!
-   console.log('Old code to be removed')
+   console.log('New and shiny code!')
  }

Marking individual text inside lines

function demo() {
  // Mark any given text inside lines
  return 'Multiple matches of the given text are supported';
}

Regular expressions

console.log('The words yes and yep will be marked.')

Escaping forward slashes

echo "Test" > /home/test.txt

Selecting inline marker types (mark, ins, del)

function demo() {
  console.log('These are inserted and deleted marker types');
  // The return statement uses the default marker type
  return true;
}

Word Wrap

Configuring word wrap per block

// Example with wrap
function getLongString() {
  return 'This is a very long string that will most probably not fit into the available space unless the container is extremely wide'
}

// Example with wrap=false
function getLongString() {
  return 'This is a very long string that will most probably not fit into the available space unless the container is extremely wide'
}

Configuring indentation of wrapped lines

// Example with preserveIndent (enabled by default)
function getLongString() {
  return 'This is a very long string that will most probably not fit into the available space unless the container is extremely wide'
}

// Example with preserveIndent=false
function getLongString() {
  return 'This is a very long string that will most probably not fit into the available space unless the container is extremely wide'
}

Collapsible Sections

// All this boilerplate setup code will be collapsed
import { someBoilerplateEngine } from '@example/some-boilerplate'
import { evenMoreBoilerplate } from '@example/even-more-boilerplate'

const engine = someBoilerplateEngine(evenMoreBoilerplate())

// This part of the code will be visible by default
engine.doSomething(1, 2, 3, calcFn)

function calcFn() {
  // You can have multiple collapsed sections
  const a = 1
  const b = 2
  const c = a + b

  // This will remain visible
  console.log(`Calculation result: ${a} + ${b} = ${c}`)
  return c
}

// All this code until the end of the block will be collapsed again
engine.closeConnection()
engine.freeMemory()
engine.shutdown({ reason: 'End of example boilerplate code' })

Line Numbers

Displaying line numbers per block

// This code block will show line numbers
console.log('Greetings from line 2!')
console.log('I am on line 3')

// Line numbers are disabled for this block
console.log('Hello?')
console.log('Sorry, do you know what line I am on?')

Changing the starting line number

console.log('Greetings from line 5!')
console.log('I am on line 6')

Simple Guides for Fuwari

Mon, 01 Apr 2024 00:00:00 GMT

Cover image source: Source

This blog template is built with Astro. For the things that are not mentioned in this guide, you may find the answers in the Astro Docs.

Front-matter of Posts

---
title: My First Blog Post
published: 2023-09-09
description: This is the first post of my new Astro blog.
image: ./cover.jpg
tags: [Foo, Bar]
category: Front-end
draft: false
---

Attribute	Description
`title`	The title of the post.
`published`	The date the post was published.
`description`	A short description of the post. Displayed on index page.
`image`	The cover image path of the post.<br/>1. Start with `http://` or `https://`: Use web image<br/>2. Start with `/`: For image in `public` dir<br/>3. With none of the prefixes: Relative to the markdown file
`tags`	The tags of the post.
`category`	The category of the post.
`draft`	If this post is still a draft, which won't be displayed.

Where to Place the Post Files

Your post files should be placed in src/content/posts/ directory. You can also create sub-directories to better organize your posts and assets.

src/content/posts/
├── post-1.md
└── post-2/
    ├── cover.png
    └── index.md

Markdown Example

Sun, 01 Oct 2023 00:00:00 GMT

An h1 header

Paragraphs are separated by a blank line.

2nd paragraph. Italic, bold, and monospace. Itemized lists look like:

this one
that one
the other one

Note that --- not considering the asterisk --- the actual text content starts at 4-columns in.

Block quotes are written like so.

They can span multiple paragraphs, if you like.

Use 3 dashes for an em-dash. Use 2 dashes for ranges (ex., "it's all in chapters 12--14"). Three dots ... will be converted to an ellipsis. Unicode is supported. ☺

An h2 header

Here's a numbered list:

first item
second item
third item

Note again how the actual text starts at 4 columns in (4 characters from the left side). Here's a code sample:

# Let me re-iterate ...
for i in 1 .. 10 { do-something(i) }

As you probably guessed, indented 4 spaces. By the way, instead of indenting the block, you can use delimited blocks, if you like:

define foobar() {
    print "Welcome to flavor country!";
}

(which makes copying & pasting easier). You can optionally mark the delimited block for Pandoc to syntax highlight it:

import time
# Quick, count to ten!
for i in range(10):
    # (but not *too* quick)
    time.sleep(0.5)
    print i

An h3 header

Now a nested list:

First, get these ingredients:
- carrots
- celery
- lentils
Boil some water.

Dump everything in the pot and follow this algorithm:

 find wooden spoon
 uncover pot
 stir
 cover pot
 balance wooden spoon precariously on pot handle
 wait 10 minutes
 goto first step (or shut off burner when done)

Do not bump wooden spoon or it will fall.

Notice again how text always lines up on 4-space indents (including that last line which continues item 3 above).

Here's a link to a website, to a local doc, and to a section heading in the current doc. Here's a footnote [^1].

[^1]: Footnote text goes here.

Tables can look like this:

size material color

9 leather brown 10 hemp canvas natural 11 glass transparent

Table: Shoes, their sizes, and what they're made of

(The above is the caption for the table.) Pandoc also supports multi-line tables:

keyword text

red Sunsets, apples, and other red or reddish things.

green Leaves, grass, frogs and other things it's not easy being.

A horizontal rule follows.

Here's a definition list:

apples : Good for making applesauce. oranges : Citrus! tomatoes : There's no "e" in tomatoe.

Again, text is indented 4 spaces. (Put a blank line between each term/definition pair to spread things out more.)

Here's a "line block":

| Line one | Line too | Line tree

and images can be specified like so:

Inline math equations go in like so: $\omega = d\phi / dt$. Display math should get its own line and be put in in double-dollarsigns:

$$I = \int \rho R^{2} dV$$

$$ \begin{equation*} \pi =3.1415926535 ;8979323846;2643383279;5028841971;6939937510;5820974944 ;5923078164;0628620899;8628034825;3421170679;\ldots \end{equation*} $$

And note that you can backslash-escape any punctuation characters which you wish to be displayed literally, ex.: `foo`, *bar*, etc.

Include Video in the Posts

Tue, 01 Aug 2023 00:00:00 GMT

Just copy the embed code from YouTube or other platforms, and paste it in the markdown file.

---
title: Include Video in the Post
published: 2023-10-19
// ...
---

<iframe width="100%" height="468" src="https://www.youtube.com/embed/5gIf0_xpFPI?si=N1WTorLKL0uwLsU_" title="YouTube video player" frameborder="0" allowfullscreen></iframe>

YouTube

Bilibili