import type { React } from '../deps.ts';import { fs, path, colors } from '../deps.ts';
import { pick, unique, sortByInsert, importDefault, logger, walk, getPagicConfigPath, importPlugin, importTheme, serve, getGitBranch,} from './utils/mod.ts';import type { PagePropsSidebar, PagicConfigSidebar } from './plugins/sidebar.tsx';import type { PagePropsBlog } from './plugins/blog.tsx';import type { GaProps } from './plugins/ga_component.tsx';import type { GitalkProps } from './plugins/gitalk_component.tsx';
export interface PagicConfig { srcDir: string; outDir: string; include?: string[]; exclude?: string[]; root: string; theme: string; plugins: string[]; watch: boolean; serve: boolean; port: number;
title?: string; description?: string; head?: React.ReactElement | null; github?: string; tocAd?: React.ReactElement; tools?: { editOnGitHub: boolean; backToTop: boolean; }; branch?: string;
nav?: { text: string; link: string; icon?: string; target?: '_blank' | string; popover?: React.ReactElement; align?: 'left' | 'right'; }[]; sidebar?: PagicConfigSidebar; md?: { anchorLevel?: (1 | 2 | 3 | 4 | 5 | 6)[]; tocEnabled?: boolean; tocLevel?: (1 | 2 | 3 | 4 | 5 | 6)[]; }; ga?: GaProps; gitalk?: GitalkProps; blog?: { root: string; social?: { github: string; email: string; twitter: string; v2ex: string; zhihu: string; }; }; i18n?: { languages: { code: string; name: string; root: string }[]; overrides?: Record<string, any>; resources?: Record<string, { translation: Record<string, string> }>; };
[key: string]: any;}
export interface PagicThemeConfig { files: [];}
export interface PagicPlugin { name: string; insert?: string; fn: (ctx: Pagic) => Promise<void>;}
export type PagicLayout<T = Record<string, any>> = React.FC<PageProps & T>;
export interface PageProps { title: string; content: React.ReactElement | null; contentTitle?: React.ReactElement; contentBody?: React.ReactElement; toc?: React.ReactElement | null; author?: string; contributors?: string[]; date?: Date | string; updated?: Date | string | null; excerpt?: string; cover?: string; tags?: string[]; categories?: string[];
config: PagicConfig; pagePath: string; layoutPath: string; outputPath: string; head: React.ReactElement | null; script: React.ReactElement | null;
loading?: boolean;
sidebar?: PagePropsSidebar; prev?: PagePropsSidebar[0]; next?: PagePropsSidebar[0]; ga?: React.ReactElement; gitalk?: React.ReactElement; blog?: PagePropsBlog; language?: { code: string; name: string; root: string };
[key: string]: any;}
export default class Pagic { public static defaultConfig: PagicConfig = { srcDir: '.', outDir: 'dist', include: undefined, exclude: [ '**/.*', '**/package.json', '**/package-lock.json', '**/node_modules', 'pagic.config.ts', 'pagic.config.tsx', '**/config.gypi', '**/CVS', '**/npm-debug.log',
], root: '/', theme: 'default', plugins: ['clean', 'init', 'md', 'tsx', 'script', 'layout', 'out'], watch: false, serve: false, port: 8000, }; public static REGEXP_PAGE = /[\/\\][^_][^\/\\]*\.(md|tsx)$/; public static REGEXP_LAYOUT = /[\/\\]_[^\/\\]+\.tsx$/;
public pagicConfigPath: string; public config: PagicConfig = {};
public pagePaths: string[] = []; public layoutPaths: string[] = []; public staticPaths: string[] = []; public writeFiles: Record<string, string> = {}; public pagePropsMap: Record<string, PageProps> = {}; public rebuilding = true;
public projectConfig: Partial<PagicConfig> = {}; private runtimeConfig: Partial<PagicConfig> = {};
private changedPaths: string[] = []; private timeoutHandler: number | undefined = undefined;
public constructor(config: Partial<PagicConfig> = {}) { this.runtimeConfig = config; }
public async build() { await this.rebuild(); if (this.config.serve) { this.serve(); } if (this.config.watch) { this.watch(); } }
public async generateThemeMod() { this.config = { ...Pagic.defaultConfig, exclude: [...Pagic.defaultConfig.exclude!, 'mod.ts'], };
await this.initPaths(); await Deno.writeTextFile( './mod.ts', `export default {\n files: [\n${[...this.staticPaths, ...this.layoutPaths] .map((filePath) => ` '${filePath}'`) .join(',\n')}\n ]\n};\n`, ); }
public getConfig(pagePath?: string) { if (typeof pagePath === 'undefined') { return this.config; } return this.pagePropsMap[pagePath].config; }
private async rebuild() { this.rebuilding = true; this.pagePropsMap = {}; this.writeFiles = {};
await this.initConfig(); await this.initPaths(); await this.runPlugins(); }
private async initConfig() { this.pagicConfigPath = await getPagicConfigPath(); this.projectConfig = await importDefault(this.pagicConfigPath, { reload: true, }); let config = { ...Pagic.defaultConfig, ...this.projectConfig, ...this.runtimeConfig, }; if (typeof config.branch === 'undefined') { const branch = await getGitBranch(); config.branch = branch; } config.exclude = unique([ ...(Pagic.defaultConfig.exclude ?? []), ...(this.projectConfig.exclude ?? []), ...(this.runtimeConfig.exclude ?? []), config.outDir, ]); config.plugins = unique([ ...Pagic.defaultConfig.plugins, ...(this.projectConfig.plugins ?? []), ...(this.runtimeConfig.plugins ?? []), ]); this.config = config; }
private async serve() { serve({ serveDir: this.config.outDir, root: this.config.root, port: this.config.port, }); logger.success( 'Serve', colors.underline(this.config.outDir), `on http://127.0.0.1:${this.config.port}${this.config.root}`, ); }
private async watch() { logger.success('Watch', colors.underline(this.config.srcDir)); const watcher = Deno.watchFs([this.config.srcDir, this.pagicConfigPath]); for await (const event of watcher) { if (event.kind === 'modify' && event.paths.includes(this.pagicConfigPath)) { clearTimeout(this.timeoutHandler); this.timeoutHandler = setTimeout(async () => { this.rebuild(); }, 100); continue; } let eventPaths = event.paths.map((eventPath) => path.relative(this.config.srcDir, eventPath)); this.config.include?.forEach((glob) => { eventPaths = eventPaths.filter( (eventPath) => path.globToRegExp(glob).test(eventPath) || path.globToRegExp(`${glob}/**`).test(eventPath), ); }); this.config.exclude?.forEach((glob) => { eventPaths = eventPaths.filter( (eventPath) => !path.globToRegExp(glob).test(eventPath) && !path.globToRegExp(`${glob}/**`).test(eventPath), ); }); this.handleFileChange(eventPaths); } }
private async handleFileChange(filePaths: string[]) { if (filePaths.length === 0) return; this.changedPaths = unique([...this.changedPaths, ...filePaths]); clearTimeout(this.timeoutHandler); this.timeoutHandler = setTimeout(async () => { this.rebuilding = false; this.pagePaths = []; this.staticPaths = []; for (const changedPath of this.changedPaths) { const fullChangedPath = path.resolve(this.config.srcDir, changedPath); if (!fs.existsSync(fullChangedPath)) { logger.warn(`${changedPath} removed, start rebuild`); this.rebuilding = true; break; } else if (Deno.statSync(fullChangedPath).isDirectory) { logger.warn(`Directory ${colors.underline(changedPath)} changed, start rebuild`); this.rebuilding = true; break; } else if (Pagic.REGEXP_LAYOUT.test(fullChangedPath)) { logger.warn(`Layout ${changedPath} changed, start rebuild`); this.rebuilding = true; break; } else if (Pagic.REGEXP_PAGE.test(fullChangedPath)) { this.pagePaths.push(changedPath); } else { this.staticPaths.push(changedPath); } } if (this.rebuilding) { await this.rebuild(); } else { await this.runPlugins(); } this.changedPaths = []; }, 100); }
private async initPaths() { const { files: themeFiles } = await importTheme(this.config.theme);
this.pagePaths = await walk(this.config.srcDir, { ...pick(this.config, ['include', 'exclude']), match: [Pagic.REGEXP_PAGE], }); this.layoutPaths = unique([ ...(await walk(this.config.srcDir, { ...pick(this.config, ['include', 'exclude']), match: [Pagic.REGEXP_LAYOUT], })), ...themeFiles.filter((filename) => Pagic.REGEXP_LAYOUT.test(`/${filename}`)), ]).sort(); this.staticPaths = unique([ ...(await walk(this.config.srcDir, { ...pick(this.config, ['include', 'exclude']), skip: [Pagic.REGEXP_PAGE, Pagic.REGEXP_LAYOUT], })), ...themeFiles.filter( (filename) => !Pagic.REGEXP_PAGE.test(`/${filename}`) && !Pagic.REGEXP_LAYOUT.test(`/${filename}`), ), ]).sort(); }
private async runPlugins() { if (this.pagePaths.length === 0 && this.staticPaths.length === 0) return;
let sortedPlugins: PagicPlugin[] = []; for (let pluginName of this.config.plugins) { if (pluginName.startsWith('-')) { continue; } let plugin = await importPlugin(pluginName); sortedPlugins.push(plugin); } sortedPlugins = sortByInsert(sortedPlugins); const removedPlugins = this.config.plugins.filter((pluginName) => pluginName.startsWith('-')); sortedPlugins = sortedPlugins.filter((plugin) => !removedPlugins.includes(`-${plugin.name}`));
for (let plugin of sortedPlugins) { logger.success('Plugin', plugin.name, 'start'); await plugin.fn(this); } }}