diff --git a/config/_default/pages/articles.yml b/config/_default/pages/articles.yml index 5d2585a..49ad8bc 100644 --- a/config/_default/pages/articles.yml +++ b/config/_default/pages/articles.yml @@ -1,5 +1,9 @@ title: 技术文章 subtitle: 分享我的技术文章和学习笔记 + +# 指定使用的模板文件名,现有页面模板可见templates\pages +template: articles + categories: - name: 最新文章 icon: fas fa-pen diff --git a/config/_default/pages/bookmarks.yml b/config/_default/pages/bookmarks.yml index 8e6b00d..b660a56 100644 --- a/config/_default/pages/bookmarks.yml +++ b/config/_default/pages/bookmarks.yml @@ -1,5 +1,9 @@ title: 我的书签 subtitle: 从浏览器导入的书签收藏 + +# 指定使用的模板文件名,现有页面模板可见templates\pages +template: bookmarks + categories: - name: 技术资源 icon: fas fa-folder diff --git a/config/_default/pages/friends.yml b/config/_default/pages/friends.yml index 4eb544c..c6ee9e2 100644 --- a/config/_default/pages/friends.yml +++ b/config/_default/pages/friends.yml @@ -1,5 +1,9 @@ title: 友情链接 subtitle: 优秀的博主和朋友们 + +# 指定使用的模板文件名,现有页面模板可见templates\pages +template: friends + categories: - name: 技术博主 icon: fas fa-user-friends diff --git a/config/_default/pages/home.yml b/config/_default/pages/home.yml index 8007cd7..ec1de7d 100644 --- a/config/_default/pages/home.yml +++ b/config/_default/pages/home.yml @@ -1,3 +1,9 @@ +title: 欢迎使用 +subtitle: 个人导航站点 + +# 指定使用的模板文件名,现有页面模板可见templates\pages +template: home + categories: - name: 常用网站 icon: fas fa-star diff --git a/config/_default/pages/projects.yml b/config/_default/pages/projects.yml index 786c1cb..bfad448 100644 --- a/config/_default/pages/projects.yml +++ b/config/_default/pages/projects.yml @@ -1,5 +1,9 @@ title: 我的项目 subtitle: 这里展示了我的一些个人项目和开源贡献 + +# 指定使用的模板文件名,现有页面模板可见templates\pages +template: projects + categories: - name: 个人项目 icon: fas fa-code diff --git a/src/generator.js b/src/generator.js index 5c90829..9f83ce5 100644 --- a/src/generator.js +++ b/src/generator.js @@ -88,7 +88,46 @@ function renderTemplate(templateName, data, useLayout = true) { // 检查模板是否存在 if (!fs.existsSync(templatePath)) { - throw new Error(`Template ${templateName}.hbs not found. Cannot proceed without template.`); + // 尝试使用通用模板 page.hbs + const genericTemplatePath = path.join(process.cwd(), 'templates', 'pages', 'page.hbs'); + + if (fs.existsSync(genericTemplatePath)) { + console.log(`模板 ${templateName}.hbs 不存在,使用通用模板 page.hbs 代替`); + const genericTemplateContent = fs.readFileSync(genericTemplatePath, 'utf8'); + const genericTemplate = handlebars.compile(genericTemplateContent); + + // 添加 pageId 到数据中,以便通用模板使用 + const enhancedData = { + ...data, + pageId: templateName // 确保pageId在模板中可用 + }; + + // 渲染页面内容 + const pageContent = genericTemplate(enhancedData); + + // 如果不使用布局,直接返回页面内容 + if (!useLayout) { + return pageContent; + } + + try { + // 使用辅助函数获取默认布局模板 + const { template: layoutTemplate } = getDefaultLayoutTemplate(); + + // 准备布局数据,包含页面内容 + const layoutData = { + ...enhancedData, + body: pageContent + }; + + // 渲染完整页面 + return layoutTemplate(layoutData); + } catch (layoutError) { + throw new Error(`Error rendering layout for ${templateName}: ${layoutError.message}`); + } + } else { + throw new Error(`Template ${templateName}.hbs not found and generic template page.hbs not found. Cannot proceed without template.`); + } } try { @@ -660,7 +699,8 @@ function renderPage(pageId, config) { // 准备页面数据 const data = { ...config, - currentPage: pageId + currentPage: pageId, + pageId // 同时保留pageId字段,用于通用模板 }; // 确保navigation是数组 @@ -697,8 +737,15 @@ function renderPage(pageId, config) { Object.assign(data, config[pageId]); } + // 检查页面配置中是否指定了模板 + let templateName = pageId; + if (config[pageId] && config[pageId].template) { + templateName = config[pageId].template; + console.log(`页面 ${pageId} 使用指定模板: ${templateName}`); + } + // 直接渲染页面内容,不使用layout布局(因为layout会在generateHTML中统一应用) - return renderTemplate(pageId, data, false); + return renderTemplate(templateName, data, false); } /** diff --git a/templates/README.md b/templates/README.md index e5de618..45d4fb2 100644 --- a/templates/README.md +++ b/templates/README.md @@ -147,6 +147,32 @@ MeNav 模板系统的数据流如下: ## 模板使用示例 +### 布局模板使用 +布局模板通常只有一个 `default.hbs`,会自动被系统使用。 + +### 页面模板使用 +页面模板对应导航中的各个页面,有两种使用方式: + +1. **自动匹配**:系统会尝试使用与页面ID同名的模板(例如:页面ID为 `projects` 时会使用 `projects.hbs`) +2. **显式指定**:在页面配置中使用 `template` 字段指定要使用的模板 + +#### 模板指定示例 +在 `config/user/pages/项目.yml` 中: + +```yaml +title: "我的项目" +subtitle: "这里展示我的所有项目" +template: "projects" # 使用 projects.hbs 模板而不是使用页面ID命名的模板 +categories: + - name: "网站项目" + icon: "fas fa-globe" + sites: + - name: "个人博客" + # ... 其他字段 +``` + +**注意**:当系统找不到指定的模板或与页面ID匹配的模板时,会自动使用通用模板 `page.hbs`。 + ### 引用组件 在页面或其他组件中引用组件: