layout.tsx

layout.tsx

基本信息

  • 类型: Next.js 根布局 (Server Component)
  • 路径: ./src/app/layout.tsx

功能描述

应用的根布局组件，负责全局字体加载、主题配置、元数据设置、以及整体页面结构（Header、Footer、Providers 等）。支持 RTL 语言和动态主题定制。

路由

  • 路径: 所有页面
  • 参数: 无

依赖导入

  • next - Metadata 类型
  • next/font/google - Google 字体（Inter、Noto Sans Arabic、Geist Mono、Playfair Display）
  • next/headers - 请求头获取
  • next-intl/server - 服务端国际化
  • @/components/providers - 全局 Provider 组件
  • @/components/layout/header - 页头组件
  • @/components/layout/footer - 页脚组件
  • @/components/layout/cookie-consent - Cookie 同意横幅
  • @/components/layout/analytics - 分析组件
  • @/components/seo/structured-data - 结构化数据
  • @/components/layout/app-banner - 应用横幅
  • @/components/providers/locale-detector - 语言检测器
  • @/lib/config - 配置管理
  • @/lib/i18n/config - i18n 配置
  • ./globals.css - 全局样式

主要功能

  • 配置和加载多语言字体（拉丁语、阿拉伯语）
  • 设置全局 SEO 元数据（title、description、keywords、OpenGraph、Twitter Cards）
  • 动态计算主题颜色（HEX 转 OKLCH）
  • 根据配置应用主题变量（radius、primary color）
  • 检测 RTL 语言并设置文档方向
  • 嵌入路由和儿童模式特殊处理（不显示 Header/Footer）
  • 集成 Google Analytics
  • 提供全局 Providers（主题、国际化等）

SEO

  • title: prompts.chat - AI Prompts Community
  • description: Discover, collect, and share the best AI prompts for ChatGPT, Claude, Gemini, and more. Join the largest community of AI prompt engineers and creators.
  • keywords: AI prompts, ChatGPT prompts, Claude prompts, prompt engineering, AI tools, prompt library, GPT prompts, AI assistant, prompt templates
  • OpenGraph: 支持网站预览卡片
  • Twitter Cards: 支持 Twitter 分享卡片
← 返回目录