feat: 增强 Markdown 代码块的高亮显示效果,支持更多 Bash 命令与别名解析
生产环境部署 - BlogFlare 至 Cloudflare Pages / 构建与自动化上线 (push) Successful in 3m57s

This commit is contained in:
seahi committed 2026-08-05 15:42:49 +08:00
1 parent f5128ebdb1
commit 69dffd72de
1 file changed
+55 -1
+55 -1
View File
@@ -5,6 +5,43 @@
import { Fancybox } from '@fancyapps/ui/dist/index.js'; import { Fancybox } from '@fancyapps/ui/dist/index.js';
import '@fancyapps/ui/dist/fancybox/fancybox.css'; import '@fancyapps/ui/dist/fancybox/fancybox.css';
// 增强 highlight.js 的 bash 语法定义:补足常用运维及工程工具的主命令、子命令以及参数开关
const bashLang = hljs.getLanguage('bash');
if (bashLang && bashLang.keywords && typeof bashLang.keywords === 'object') {
const kw = bashLang.keywords as Record<string, string[] | undefined>;
// 1. 添加主命令(显示为内建或核心命令样式)
if (Array.isArray(kw.built_in)) {
kw.built_in.push(
'docker', 'podman', 'openstack', 'kubectl', 'kubeadm', 'helm',
'systemctl', 'journalctl', 'firewalld', 'iptables', 'crictl', 'nerdctl',
'ansible', 'terraform', 'vagrant', 'wrangler', 'pnpm', 'npm', 'gitea',
'curl', 'wget', 'git', 'cargo', 'bun'
);
}
// 2. 添加操作动作与资源类子命令(显示为字面或特色参数样式)
const customSubcommands = [
'run', 'exec', 'ps', 'build', 'image', 'images', 'container', 'pull', 'push',
'apply', 'get', 'describe', 'delete', 'logs', 'create', 'edit', 'rollout',
'scale', 'port-forward', 'cluster-info', 'server', 'flavor', 'volume',
'network', 'subnet', 'router', 'keypair', 'floating', 'list', 'show',
'start', 'stop', 'restart', 'status', 'enable', 'disable', 'daemon-reload',
'clone', 'commit', 'checkout', 'branch', 'merge', 'rebase', 'fetch',
'install', 'add', 'remove', 'dev', 'deploy', 'attach', 'rmi', 'rm'
];
if (Array.isArray(kw.literal)) {
kw.literal.push(...customSubcommands);
} else {
kw.literal = customSubcommands;
}
// 3. 匹配 -d, --name, -p 等选项开关(限定必须位于空格或行首后面,避免误伤中间带破折号的普通名称)
if (Array.isArray(bashLang.contains)) {
bashLang.contains.unshift({
className: 'attr',
begin: /(?<=\s|^)-+[a-zA-Z0-9_-]+/
});
}
}
let { content = '' } = $props<{ content: string }>(); let { content = '' } = $props<{ content: string }>();
let container: HTMLElement; let container: HTMLElement;
@@ -15,7 +52,24 @@
renderer: { renderer: {
code(token) { code(token) {
const code = token.text; const code = token.text;
const rawLang = (token.lang || '').trim().toLowerCase().split(' ')[0]; let rawLang = (token.lang || '').trim().toLowerCase().split(' ')[0];
// 对常见的习惯表达法强制收向 bash 处理
const bashAliases: Record<string, string> = {
k8s: 'bash',
kubectl: 'bash',
openstack: 'bash',
podman: 'bash',
systemd: 'bash',
systemctl: 'bash',
console: 'bash',
terminal: 'bash',
zsh: 'bash',
sh: 'bash'
};
if (bashAliases[rawLang]) {
rawLang = bashAliases[rawLang];
}
let highlighted: string; let highlighted: string;
let language = 'plaintext'; let language = 'plaintext';