使中文和日文分别应用自己的字体

由于中文和日文有一些字符是相同的，简单将字体加进fontFamily有时会导致两种字体混合出现的情况。

通过在font.css中设置，并且实现LocaleText组件，可以实现中文和日文分别应用自己的字体。

.chinese-text {
  font-family: var(--font-pangolin), var(--font-zcool-kuaile), system-ui, sans-serif;
}

.japanese-text {
  font-family: var(--font-pangolin), var(--font-zen-maru), system-ui, sans-serif;
}

// components/LocaleText.tsx
'use client'
import { useContext } from 'react'
import { LanguageContext } from 'utils/locale'

interface LocaleTextProps {
  children: React.ReactNode
  className?: string
}

export default function LocaleText({ children, className = '' }: LocaleTextProps) {
  const { currentLang } = useContext(LanguageContext)

  const textClass =
    currentLang === 'zh' ? 'chinese-text' : currentLang === 'ja' ? 'japanese-text' : ''

  return <span className={`${textClass} ${className}`}>{children}</span>
}

最后在自动翻译中调用LocaleText组件

// utils/locale.tsx

wsl-crashes

1, vscode server导致, 删除后自动重装即可

rm -rf ~/.vscode-server

2, 手动删除

rm -rf /mnt/c/Users/CamTrik/AppData/Local/Temp/wsl-crashes/*

在wsl中设置定时任务：
运行crontab -e，在文件末尾添加每分钟执行一次上面命令

*/1 * * * * rm -rf /mnt/c/Users/CamTrik/AppData/Local/Temp/wsl-crashes/*

保证cron已经在运行

sudo service cron start

3, 在.wslconfig中设置 (没起作用)

[wsl2]
kernelCommandLine = sysctl.kernel.core_pattern=/dev/null

react-slick问题

react-slick导入后无法Build成功

'Slider' cannot be used as a JSX component.
  Its instance type 'Slider' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("c:/Users/bello/node_modules/@types/react/ts5.0/index").ReactNode'.
        Type 'PromiseLikeOfReactNode' is not assignable to type 'ReactNode'.ts(2786)

yarn dedupe '@types/react'

TOC类型问题

TOC的类型认证报错：

{toc && <TOC toc={toc as TOCItem[]} />}

# error info
Conversion of type 'string' to type 'TOCItem[]' may be a mistake because neither type
sufficiently overlaps with the other. If this was intentional,
convert the expression to 'unknown' first.

将contentlayer.config.ts中toc的类型改为json即可。

VSCode缩进问题

在 VSCode 中，您可以为不同的项目分别设置不同的缩进规则。这可以通过项目级别的设置文件来实现。以下是设置方法：

为每个项目创建一个项目级别的设置文件：
- 在项目根目录下创建一个 .vscode 文件夹
- 在该文件夹中创建一个 settings.json 文件
在 TypeScript 项目的 settings.json 中添加以下配置：

{
  "editor.tabSize": 2,
  "editor.insertSpaces": true,
  "[typescript]": {
    "editor.tabSize": 2,
    "editor.insertSpaces": true
  },
  "[typescriptreact]": {
    "editor.tabSize": 2,
    "editor.insertSpaces": true
  }
}

在 Go 项目的 settings.json 中添加以下配置：

{
  "editor.tabSize": 4,
  "editor.insertSpaces": true,
  "[go]": {
    "editor.tabSize": 4,
    "editor.insertSpaces": false
  }
}

这样，当您在 TypeScript 项目中创建新文件时，缩进将默认为 2 个空格，而在 Go 项目中创建新文件时，缩进将默认为 4 个空格（实际上 Go 通常使用制表符而非空格，所以我设置了 "editor.insertSpaces": false）。

VSCode 会自动识别并应用项目级别的设置，这样您就可以在不同项目中拥有不同的默认缩进了。