fix(generator): 修复自定义页面配置不生效问题
- src/generator.js:
- 修改 `generateHTML` 和 `processTemplate` 函数,根据 `navigation` 配置动态生成所有页面 HTML,不再硬编码特定页面。
- 修改 `generateNavigation` 函数,添加通用子菜单处理逻辑,支持为任意包含 `categories` 的页面生成子菜单。
- templates/index.html:
- 移除硬编码的页面 `div` 结构。
- 使用 `{{ALL_PAGES}}` 占位符动态注入所有页面内容。
- README.md:
- 更新文档配置说明
Closes #6
This commit is contained in:
122
src/generator.js
122
src/generator.js
@@ -302,6 +302,18 @@ function generateNavigation(navigation, config) {
|
||||
`).join('')}
|
||||
</div>`;
|
||||
}
|
||||
// 通用处理:任意自定义页面的子菜单生成
|
||||
else if (config[nav.id] && config[nav.id].categories && Array.isArray(config[nav.id].categories)) {
|
||||
submenuItems = `
|
||||
<div class="submenu">
|
||||
${config[nav.id].categories.map(category => `
|
||||
<a href="#${category.name}" class="submenu-item" data-page="${nav.id}" data-category="${category.name}">
|
||||
<i class="${escapeHtml(category.icon)}"></i>
|
||||
<span>${escapeHtml(category.name)}</span>
|
||||
</a>
|
||||
`).join('')}
|
||||
</div>`;
|
||||
}
|
||||
|
||||
return `
|
||||
<div class="nav-item-wrapper">
|
||||
@@ -491,32 +503,38 @@ function generateHTML(config) {
|
||||
// 首页内容
|
||||
pageContents.home = generateHomeContent(config);
|
||||
|
||||
// 如果配置了项目页面
|
||||
if (config.projects) {
|
||||
pageContents.projects = generatePageContent('projects', config.projects);
|
||||
// 动态生成所有其他页面的内容
|
||||
if (config.navigation && Array.isArray(config.navigation)) {
|
||||
config.navigation.forEach(navItem => {
|
||||
const pageId = navItem.id;
|
||||
// 跳过已处理的首页和搜索结果页
|
||||
if (pageId === 'home' || pageId === 'search-results') {
|
||||
return;
|
||||
}
|
||||
|
||||
// 如果配置中存在该页面的配置,则生成页面内容
|
||||
if (config[pageId]) {
|
||||
pageContents[pageId] = generatePageContent(pageId, config[pageId]);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 如果配置了文章页面
|
||||
if (config.articles) {
|
||||
pageContents.articles = generatePageContent('articles', config.articles);
|
||||
}
|
||||
// 生成首页HTML
|
||||
const homeHTML = `
|
||||
<!-- home页 -->
|
||||
<div class="page active" id="home">
|
||||
${pageContents.home}
|
||||
</div>`;
|
||||
|
||||
// 如果配置了友链页面
|
||||
if (config.friends) {
|
||||
pageContents.friends = generatePageContent('friends', config.friends);
|
||||
}
|
||||
|
||||
// 如果配置了书签页面
|
||||
if (config.bookmarks) {
|
||||
pageContents.bookmarks = generatePageContent('bookmarks', config.bookmarks);
|
||||
}
|
||||
|
||||
// 生成所有页面的HTML
|
||||
const pagesHTML = Object.entries(pageContents).map(([id, content]) => `
|
||||
// 生成其他页面的HTML
|
||||
const dynamicPagesHTML = Object.entries(pageContents)
|
||||
.filter(([id]) => id !== 'home') // 排除首页
|
||||
.map(([id, content]) => `
|
||||
<!-- ${id}页 -->
|
||||
<div class="page${id === 'home' ? ' active' : ''}" id="${id}">
|
||||
<div class="page" id="${id}">
|
||||
${content}
|
||||
</div>`).join('\n');
|
||||
</div>`)
|
||||
.join('\n');
|
||||
|
||||
// 生成搜索结果页面
|
||||
const searchResultsHTML = generateSearchResultsPage(config);
|
||||
@@ -586,7 +604,8 @@ ${generateSocialLinks(config.social)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
${pagesHTML}
|
||||
${homeHTML}
|
||||
${dynamicPagesHTML}
|
||||
|
||||
<!-- 搜索结果页 -->
|
||||
<div class="page" id="search-results">
|
||||
@@ -651,21 +670,55 @@ function processTemplate(template, config) {
|
||||
const googleFontsLink = generateGoogleFontsLink(config);
|
||||
const fontVariables = generateFontVariables(config);
|
||||
|
||||
// 生成所有页面的HTML
|
||||
let allPagesHTML = '';
|
||||
|
||||
// 确保按照导航顺序生成页面
|
||||
if (config.navigation && Array.isArray(config.navigation)) {
|
||||
// 按照导航中的顺序生成页面
|
||||
config.navigation.forEach(navItem => {
|
||||
const pageId = navItem.id;
|
||||
|
||||
// 跳过搜索结果页
|
||||
if (pageId === 'search-results') {
|
||||
return;
|
||||
}
|
||||
|
||||
let pageContent = '';
|
||||
let isActive = pageId === 'home' ? ' active' : '';
|
||||
|
||||
// 根据页面ID生成对应内容
|
||||
if (pageId === 'home') {
|
||||
pageContent = generateHomeContent(config);
|
||||
} else if (config[pageId]) {
|
||||
pageContent = generatePageContent(pageId, config[pageId]);
|
||||
} else {
|
||||
pageContent = `<div class="welcome-section">
|
||||
<h2>页面未配置</h2>
|
||||
<p class="subtitle">请配置 ${pageId} 页面</p>
|
||||
</div>`;
|
||||
}
|
||||
|
||||
// 添加页面HTML
|
||||
allPagesHTML += `
|
||||
<!-- ${pageId}页 -->
|
||||
<div class="page${isActive}" id="${pageId}">
|
||||
${pageContent}
|
||||
</div>`;
|
||||
});
|
||||
}
|
||||
|
||||
// 创建替换映射
|
||||
const replacements = {
|
||||
'{{SITE_TITLE}}': escapeHtml(config.site.title),
|
||||
'{{SITE_LOGO_TEXT}}': escapeHtml(config.site.logo_text || '导航站'), // 从配置中获取,如果不存在则使用默认值
|
||||
'{{SITE_LOGO_TEXT}}': escapeHtml(config.site.logo_text || '导航站'),
|
||||
'{{GOOGLE_FONTS}}': googleFontsLink,
|
||||
'{{{FONT_VARIABLES}}}': fontVariables,
|
||||
'{{NAVIGATION}}': generateNavigation(config.navigation, config),
|
||||
'{{SOCIAL_LINKS}}': generateSocialLinks(config.social),
|
||||
'{{CURRENT_YEAR}}': currentYear,
|
||||
'{{HOME_CONTENT}}': generateHomeContent(config),
|
||||
'{{PROJECTS_CONTENT}}': generatePageContent('projects', config.projects),
|
||||
'{{ARTICLES_CONTENT}}': generatePageContent('articles', config.articles),
|
||||
'{{FRIENDS_CONTENT}}': generatePageContent('friends', config.friends),
|
||||
'{{BOOKMARKS_CONTENT}}': generatePageContent('bookmarks', config.bookmarks),
|
||||
'{{SEARCH_RESULTS}}': generateSearchResultsPage(config)
|
||||
'{{SEARCH_RESULTS}}': generateSearchResultsPage(config),
|
||||
'{{ALL_PAGES}}': allPagesHTML
|
||||
};
|
||||
|
||||
// 执行替换
|
||||
@@ -731,4 +784,13 @@ function main() {
|
||||
}
|
||||
}
|
||||
|
||||
main();
|
||||
main();
|
||||
|
||||
// 导出供测试使用的函数
|
||||
module.exports = {
|
||||
loadConfig,
|
||||
generateHTML,
|
||||
copyStaticFiles,
|
||||
generateNavigation,
|
||||
generateCategories
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user