让Yohaku同时展示萌ICP与标准ICP备案
引入
原版的Yohaku只能展示一个ICP,在云函数部分配置:
{
"footer": {
"otherInfo": {
"date": "2024-{{now}}",
"icp": {
"text": "萌 ICP 备 20250030 号",
"link": "https://icp.gov.moe/?keyword=20250030"
}
},
//....
但是对于既有萌ICP,又有标准ICP备案的情况就左右为难了
修改源码
通过修改两个文件可以实现展示多个备案号:
在app.config.d.ts的 36 行附近添加新定义的moeicp
//第 36 行附近
export interface OtherInfo {
date: string
icp?: {
text: string
link: string
}
moeicp?: {
text: string
link: string
}
}
在FooterInfo.tsx的 36 行附近添加新定义的moeicp
//第 35 行附近
const { date: dateRaw, icp } = otherInfo || {}
const { date: dateRaw, icp, moeicp } = otherInfo || {}
const displayMoeIcp = moeicp
//第 98 行附近
{(icp || displayMoeIcp) && (
<div className="mt-0.5 flex flex-wrap items-center gap-4">
{icp && (
<StyledLink external href={icp.link} rel="noreferrer">
{icp.text}
</StyledLink>
)}
{displayMoeIcp && (
<StyledLink external href={displayMoeIcp.link} rel="noreferrer">
{displayMoeIcp.text}
</StyledLink>
)}
</div>
)}
//第 155 行附近
</span>
{(icp || displayMoeIcp) && (
<span className="flex items-center gap-4 text-sm text-neutral-6">
{icp && (
<StyledLink external href={icp.link} rel="noreferrer">
{icp.text}
</StyledLink>
)}
{displayMoeIcp && (
<StyledLink external href={displayMoeIcp.link} rel="noreferrer">
{displayMoeIcp.text}
</StyledLink>
)}
</span>
)}
</div>
新增配置文件
增加云函数部分的配置,以展示两个备案号了
{
"footer": {
"otherInfo": {
"date": "2020-{{now}}",
"icp": {
"text": "渝 ICP 备 2025073510 号",
"link": "https://beian.miit.gov.cn/"
},
"moeicp": {
"text": "萌 ICP 备 20250030 号",
"link": "https://icp.gov.moe/?keyword=20250030"
}
},
//....