Skip to content
On this page

配置

配置文件

本项目使用 /src/lib/config/ 作为配置文件目录,但多数配置在一般情况下无需修改。

site.ts | 站点信息

ts
export const site: SiteConfig = {
  protocol: import.meta.env.URARA_SITE_PROTOCOL ?? import.meta.env.DEV ? 'http://' : 'https://', // 协议(一般无需更改)
  domain: import.meta.env.URARA_SITE_DOMAIN ?? 'urara-demo.netlify.app', // 域名
  title: 'Urara', // 标题
  subtitle: 'Sweet & Powerful SvelteKit Blog Template', // 副标题
  lang: 'zh-CN', // 语言
  descr: 'Powered by SvelteKit/Urara', // 描述
  author: {
    name: 'John Doe', // 作者名称
    avatar: '/assets/maskable@512.png', // 作者图片
    status: '🌸', // 作者状态
    bio: 'lorem ipsum dolor sit amet, consectetur adipiscing elit.' // 作者描述
  },
  themeColor: '#3D4451' // 主题颜色(目前仅用于 Manifest)
}

icon.ts | 图标

默认提供一些图标以兼容 Web app manifests 及现代浏览器,可以自行替换。

/urara/favicon.png - 网站图标,32x32
/urara/assets/any@180.png - 网站图标,180x180
/urara/assets/any@192.png - 网站 / Manifest 图标,192x192
/urara/assets/any@512.png - Manifest 图标,512x512
/urara/assets/manifest@192.png - Manifest 遮罩图标,192x192
/urara/assets/manifest@512.png - Manifest 遮罩图标,512x512

也可以通过修改 /src/lib/config/icon.ts 替换图标数量及路径。

general.ts | 主题

ts
export const theme: ThemeConfig = [
  {
    name: 'light', // 主题变量名
    text: '🌕 Light' // 主题显示名,可随意修改
  },
  {
    name: 'dark',
    text: '🌑 Dark'
  },
]

本项目使用了 daisyUI 主题,查看可用的 daisyUI 主题

general.ts | 标题栏

ts
export const header: HeaderConfig = {
  nav: [
    {
      text: 'Get Started', // 按钮名称
      link: '/hello-world' // 指向的网页,可以填写其他网页
    },
    {
      text: 'Elements',
      link: '/hello-world/elements'
    }
  ]
}

还可以根据下面的格式在标题栏添加下拉菜单。

ts
{
   text: 'Hello World',
   children: [
     {
      text: 'Get Started',
      link: '/hello-world'
     },
     {
       text: 'Elements',
       link: '/hello-world/elements'
     },
	 {
	   text: 'ToC Disabled',
	   link: '/hello-world/toc-disabled'
	 }
   ]
}

general.ts | 页脚

大致与标题相同,下拉菜单除外。

ts
export const footer: FooterConfig = {
  nav: [
    {
      text: 'Feed', // 超链接名称
      link: '/atom.xml' // 指向的页面,可以填写其他网页
    },
    {
      text: 'Sitemap',
      link: '/sitemap.xml'
    }
  ]
}

general.ts | 日期格式

ts
export const date: DateConfig = {
  locales: 'zh-CN', // 语言,可参考 IETF 语言标签
  options: {
    year: '2-digit', // 年份: numeric / 2-digit
    weekday: 'long', // 星期: narrow / short / long
    month: 'short', // 月份: numeric / 2-digit / narrow / short / long
    day: 'numeric' // 日期: numeric / 2-digit
  }
}

要添加其他选项,请参考 Intl.DateTimeFormat - JavaScript | MDN