小麦的杂货铺

从 WordPress 到 Astro：一次静态博客迁移的过程、取舍与技巧

2026-08-04T16:00:00.000Z

前几天完成了一次 WordPress 博客到 Astro 静态博客的迁移。背景是博客更新没这么频繁，而且很多动态能力不需要了，开了评论，结果后台几百个各类广告的评论没有任何意义了。博客内容本身不多，就是特别要注意旧链接和旧资源要依然可靠地工作，不然SEO就全清空了。

这篇文章记录迁移过程中的关键判断、实现方式和一些容易被忽略的细节。新站以 Astro 7 和 Tailwind CSS 4 为基础；使用了 Codex + GPT-5.6-terra 作为协作工具。

Codex 通过中转使用 GPT-5.6 时 Web Search 失败的解决办法

2026-07-21T16:00:00.000Z

随着GPT-5.6 的发布，Codex 也为其进行了特殊的修改。

使用中转/反代在 Codex 中调用 GPT-5.6 时，如果 Web Search 调用失败，常见原因并不在 Codex

Astro v6 Node Adapter后端的环境变量设置（v5 到 v6 的一个 breaking change）

2026-06-06T16:00:00.000Z

这其实是Astro v6的一个改动，Changed: import.meta.env values are always inlined：

In Astro 5.13, the experimental.staticImportMetaEnv flag was introduced to update the behavior when accessing import.meta.env directly to align with Vite’s handling of environment variables and ensures that import.meta.env values are always inlined.

In Astro 5.x, non-public environment variables were replaced by a reference to process.env. Additionally, Astro could also convert the value type of your environment variables used through import.meta.env, which could prevent access to some values such as the strings “true” (which was converted to a boolean value), and “1” (which was converted to a number).

Astro 6 removes this experimental flag and makes this the new default behavior in Astro: import.meta.env values are always inlined and never coerced.

所以下面这篇文章讨论的前提，都是Astro v6。

Astro官方文档里有关于环境变量的章节，Using environment variables，里面有个例子：

// When import.meta.env.SSR === true
const data = await db(import.meta.env.DB_PASSWORD);

// When import.meta.env.SSR === false
const data = fetch(`${import.meta.env.PUBLIC_POKEAPI}/pokemon/squirtle`);

它主要使用Vite的环境变量，Env Variables and Modes，但这里其实就有个坑点，那就是这种方式的值会在build的时候被替换成实际的值，而不是在运行时动态获取，这意味着：

在build的时候就需要提供这个环境变量，不然无法替换；
在运行时无法改变这个变量，因为他已经被写入了构造物里。

假设你在代码里写了：

1	const db = drizzle(import.meta.env.DATABASE_URL);

那么在build时提供了系统环境变量或者.env的时候，且值是 mysql://user:password@localhost:3306/db，它最终的dist会变成（也就是直接inline替换了）：

1	const db = drizzle("mysql://user:password@localhost:3306/db");

谷歌GenAI Java SDK tts示例 (gemini-3.1-flash-tts-preview)

2026-05-08T16:16:11.000Z

谷歌官方文档是: https://ai.google.dev/gemini-api/docs/speech-generation

但是很尴尬,他没有java sdk的示例,而且java sdk的example里也没有对应的例子,https://github.com/googleapis/java-genai/tree/main/examples.
这两个和文档不一致examples/src/main/java/com/google/genai/examples/InteractionMultimodalResponseAudio.java, examples/src/main/java/com/google/genai/examples/InteractionMultimodalResponseAudioWithGenerateContent.java.

但其实只需要用他统一的generateContent方法就可以了.

调用方式其实和文档里的python一样,只要知道对应的类即可.

Windows 下 Codex 执行 bash 中文乱码问题排查与解决

2026-02-05T16:00:00.000Z

最近在 Windows 上使用 Codex CLI 时，遇到了一个很诡异的问题：

直接在终端执行 bash -lc "echo 你好"，输出正常。
让 Claude Code 帮我执行 bash，输出也正常。
只有 Codex 执行 bash 会出现中文乱码。

先放结论：这个问题最后不是靠 PowerShell 编码设置解决的，而是要给 Codex 设置 WSL_UTF8=1。

Vercel AI SDK 的工具审批（Approval）流程详解

2026-01-11T16:00:00.000Z

概述

在 AI 应用中，当 AI 助手需要调用本地文件系统或其他敏感工具时，出于安全考虑，需要在执行前获得用户的明确批准。Vercel AI SDK（文中使用 v6 版本，这狗东西 API 一直变来变去的）提供了工具审批（Tool Approval）机制，允许开发者在 AI 执行工具前拦截并请求用户确认。

注意这个参数主要是为了配合stopWhen（也就是工具自动调用），也就是:

const result = streamText({
  model: newapi.chat(config.model.model),
  messages,
  tools,
  stopWhen: stepCountIs(5), // 这里 自动工具调用
});

同时也注意这东西的调用方式灵活的很，毕竟他不是应用级别的封装，不用这套自己也可以搓一个出来。

同时在 AI SDK UI 中的调用流程是完全不一样的，这里只针对 Core 的 API。（但是其实也八九不离十了）

Astro 项目集成 Better Auth 指南(使用drizzle+PG)

2026-01-08T16:00:00.000Z

本文档说明如何在 Astro 项目中集成 Better Auth，使用 Drizzle 作为数据库适配器，PostgreSQL 作为数据库。

emmmm,文档是在实践完之后写的，不是边实践边写的，可能会有所遗漏，但是扫了几遍源码，应该八九不离十。

注意这个需要 server 支持，所以需要 server adapter，比如 node 的@astrojs/node。

我使用的是默认 static，需要后端运行时渲染的地方用export const prerender = false;，如果你的 output 设置为了 server，那么就不需要 prerender=false。

📖 官方文档参考：

Better Auth 安装指南

Better Auth Drizzle 适配器

Better Auth Astro 集成

步骤 1：安装依赖

首先，安装 Better Auth 及相关依赖：

# 安装核心依赖
pnpm add better-auth drizzle-orm pg dotenv

# 安装开发依赖
pnpm add -D drizzle-kit tsx @types/pg

依赖说明：

better-auth: 认证核心库
drizzle-orm: ORM 库，用于数据库操作
pg: PostgreSQL 驱动
drizzle-kit: Drizzle 开发工具（用于数据库迁移）
dotenv: 环境变量加载（drizzle.config.ts 需要）

字符编码详解：UTF-8、Unicode、GBK 等

2025-12-10T07:30:00.000Z

通俗易懂地讲解 UTF-8、Unicode、GBK 等字符编码的区别与应用，用快递系统类比帮助理解核心概念

深入理解 SSR/CSR 与 SPA/MPA：现代前端渲染模式详解

2025-12-09T14:22:00.000Z

深入理解 SSR/CSR 与 SPA/MPA 的概念关系，以及现代前端框架（Next.js、Nuxt、Remix）的 SSR 与传统后端 SSR 的本质区别

6GB显存跑Z-Image-Turbo完全指南

2025-11-27T16:00:00.000Z

手把手教你用6GB显存跑通阿里的Z-Image-Turbo，拖拉机启动！

自行部署 Next.js Docker 的挑战：臃肿、平台绑定与隐藏的“坑”

2025-11-16T12:30:00.000Z

Next.js 作为目前最受欢迎的 React 全栈框架之一，凭借其强大的功能和“开箱即用”的体验赢得了大量开发者。然而，这种便利性很大程度上依赖于其创造者 Vercel 提供的原生托管平台。但是一旦开发者选择通过 Docker 自行部署，便会发现这条路并非坦途，充满了各种不易察觉的“坑”，并且会逐渐感受到框架本身的臃肿与对特定平台的深度绑定。

这里就总结了一下我这一年实践遇到的问题，建议没有 SEO 需求还是不要碰他了。

路由与请求类型的“黑盒”

在自行部署的环境中，Next.js 的一些内部机制会变得异常棘手。以 React Server Components (RSC) 的请求为例，它与页面的请求路径一致，但会附加一个 ?_rsc=... 参数以区分（也会增加一些 header）。问题在于，这个参数（以及额外的 header）在到达我们自己的应用逻辑之前，往往已被 Next.js 框架内部“消化”。这意味着，在proxy.ts（16 之前的middleware.ts），无法捕获到 _rsc 这个参数。因此，从代码层面来看，开发者无法轻易判断一个传入的请求究竟是完整的页面加载请求，还是一个用于更新部分 UI 的 RSC 请求。

这在一些重定向场景中会造成一些问题。

Next.js 16 Cache Components 完全指南

2025-11-01T08:58:02.000Z

基于 Next.js 16.0.1 官方文档整理

Cache components除了方便的 PPR+显式缓存，另外一个就是在框架层面（主要是 dev 和构建的时候），防止用户写出动态内容卡住整个页面加载的事，这在之前很容易写出来，网上也有很多批评的文章和视频，一看连loading.tsx和Suspense都不会用。😂
现在官方强制了，也是件好事吧。

什么是 Cache Components

Cache Components 是 Next.js 16 中一种新的渲染和缓存方法，通过 Partial Prerendering (PPR) 提供细粒度的缓存控制，同时确保出色的用户体验。

核心关系

1	Cache Components = PPR + use cache

PPR 提供静态外壳和流式传输基础设施
use cache 让你在外壳中包含优化的动态输出

解决的问题

在开发动态应用时，你需要在两种方式之间权衡：

❌ 完全静态页面：加载快，但无法显示个性化或实时数据
❌ 完全动态页面：可显示最新数据，但每次请求都需要渲染所有内容，导致初始加载慢

在容器中运行的mysql数据库定时备份脚本

2025-09-28T16:13:00.000Z

单次备份直接跑:

timestamp存取差几小时? mysql timestamp的timezone问题以及如何在mysql2设置

2025-08-13T20:45:00.000Z

在 Node.js 应用中使用 MySQL 时，时间戳（TIMESTAMP）字段出现的“8 小时差异”是一个经典难题。这个问题的根源并非单一因素，而是由 MySQL 自身的时区机制、mysql2 驱动的特定行为，以及一个极具迷惑性的默认配置共同造成的。

本文将澄清 MySQL TIMESTAMP 的存储与转换原理，并深入剖析 mysql2 驱动中 timezone 配置项的真正含义及其默认值'local'所带来的陷阱，最终提供两套清晰的最佳实践方案。

drizzle如何处理mysql的bit类型

2025-08-02T12:25:00.000Z

mysql 的 boolean 类型其实是 tinyint(1)的别名，一些 ORM 工具无法识别把他识别到对应语言的 boolean 类型，日常实践有时候会选择用bit(1)这个类型，比如java的JOOQ，boolean 类型会变为 java 的Byte，而bit(1)则是 java 的Boolean。

但是 drizzle 的 mysql 内置类型中没有bit(1)。你用他的drizzle-kit pull之后会返回这个结果：

1 2	// Warning: Can't parse bit(1) from database // bit(1)Type: bit(1)("deleted").notNull(),

但是如果是已经建好的表，其他逻辑在用的话，把bit(1)改成boolean并不方便。

需要我们自己定义一个类型。

bit(1)这个类型不同驱动返回不同，有些可能是作为整数，有些可能是作为 Buffer。所以扩展一下就行：

Next.js 如何在客户端导航时获取上一页(referer)

2025-07-16T16:00:00.000Z

想给之前上线的工具站做个博客数据统计: blogs。

理所当然用到了document.referer，最方便的获取上一个页面的方式，结果发现获取到的都是第一次 load 的页面，而不是导航前的那个页面。

为什么会这样？

Next.js 在生产环境中默认采用前端导航（Client-side Navigation）的方式。这意味着页面加载完之后，在网站内部点击链接时，浏览器并不会执行一次完整的页面刷新。相反，Next.js 会在客户端通过 JavaScript 异步加载新页面的数据和组件，然后更新 DOM。

这种类似 单页应用（SPA） 的行为导致了一个关键问题：
document.referrer 的值在页面首次加载后保持不变。当通过内部链接从blog/zh/1导航到 blog/zh/post/[slug] 时，由于没有发生完整的页面重载，document.referrer 的值仍然会是最初访问网站的那个值，而不是blog/zh/1。

Next.js RSC _rsc参数丢失的那些坑以及解决方案

2025-06-24T17:35:00.000Z

最近在用 Next.js 的 RSC（React Server Component）时遇到了一个比较隐晦的问题，记录一下踩坑过程和应对方案。

如果你在项目里既使用了 CDN（并且缓存了 html），又使用了middleware的重定向（middleware 会处理 rsc 请求），又用了 RSC 特性（开启了 prefetch 等情况），如果你发现部分页面 html 变成了一大串“乱码”（其实是 rsc 请求的返回结果），可以仔细看看。

RSC 请求是怎么工作的？

Next.js 在请求 RSC 和 HTML 页面时，路径和方法其实是一样的，唯一的区别在于它会带上一个 _rsc 的参数和一些特定 header。

比如你访问页面 /about：

HTML 请求：
GET /about
RSC 请求：
GET /about?_rsc=<随机字符串> 以及特定的 header

这里的 _rsc 参数是 Next.js 内部用来标识“这是一次 RSC 请求”，header 里也有类似 Next-Router-State-Tree, rsc 等用于数据请求和分割的内容。

[翻译]我如何使用 Claude Code

2025-06-16T16:54:00.000Z

原文出处: https://spiess.dev/blog/how-i-use-claude-code

一个月前，我订阅了 Claude Max。在此之前，我已经使用包括 Claude Code 在内的 AI 代理一段时间了，但随着统一价格的推出，我的使用量猛增，它已成为我许多任务的日常驱动力。我发现自己现在去 VS Code 的次数少了很多。

由于 AI 代理目前对每个人来说都是新事物，我想分享一些我最近注意到模式可能会很有趣。以下是我如何使用 Claude code。

开始新对话 (Start New Threads)

如果说我希望你从这篇文章中学到一件事，那就是你应该更频繁地调用 /clear。

AI 代理往往随着对话时间的延长而变得更不可预测。当你提出不同问题时尤其如此。我发现即使这意味着重复一些指令，创建一个新的提示通常会更有效。

一旦我开始更积极地这样做，我的结果就显著改善了。而且我绝对不是唯一一个提出这个建议的人。

Next.js使用filerobot-image-editor

2025-05-18T09:44:00.000Z

想在工具站里集成一下图片编辑工具，找了一圈发现filerobot-image-editor相当不错。

按照nextjs的官方文档来的，什么 lazy, dymanic 都用上了，还是嗝屁了，最后还是直接用 cdn js+浏览器端 js 解决不把模块引入了, 记录一下解法。

最后的效果见: Image Editor | merchmindai

Next.js使用auth.js+dirzzle+postgresql报错分析

2025-03-20T02:23:00.000Z

在自己的测试项目里想着做登录功能，看到authjs就接到项目里去，本身就使用的drizzle，在不配置 db adapter 的情况下运行正常，但只要配置就会报错:

⨯ Error [TypeError]: Cannot read properties of undefined (reading 'reduce')
   at <unknown> (.next\server\edge\chunks\edge-wrapper_c7ecd8c0.js:709:27)
   at runModuleExecutionHooks (.next\server\edge\chunks\edge-wrapper_c7ecd8c0.js:755:9)
   at instantiateModule (.next\server\edge\chunks\edge-wrapper_c7ecd8c0.js:707:9)
   at getOrInstantiateModuleFromParent (.next\server\edge\chunks\edge-wrapper_c7ecd8c0.js:640:12)
   at esmImport (.next\server\edge\chunks\edge-wrapper_c7ecd8c0.js:143:20)
   at [project]/src/db/db.ts [middleware-edge] (ecmascript) (.next\server\edge\chunks\[root of the server]__a687996d._.js:28:218)
   at <unknown> (.next\server\edge\chunks\edge-wrapper_c7ecd8c0.js:709:27)

无法启动