Nexus/docs/changelog/2026-06-01-editor-syntax-highlight.md

2026-06-01 浮动编辑器语法高亮增强

摘要

• 注册 Nexus 深色/浅色主题（nexus-dark / nexus-light），强化关键字、字符串、注释等 token 配色。
• 扩展 语言自动识别（PHP/Shell/INI/Nginx/Docker 等运维常见后缀与文件名）。
• 新增 Nginx Monarch 语法；工具栏 语法 下拉可手动切换或选「自动」。
• 启用括号配色、缩进参考线、语义高亮、选区高亮等 Monaco 选项。

动机

用户反馈编辑器需要语法高亮；统一 Monaco 初始化与主题，避免 Teleport 面板下样式冲突导致「全灰」观感。

涉及文件

文件	变更
frontend/src/monaco/initMonaco.ts	统一初始化、编辑器默认选项
frontend/src/monaco/nexusThemes.ts	自定义主题
frontend/src/utils/editorLanguage.ts	语言检测与下拉项
frontend/src/components/FileEditorWorkbench.vue	语法选择器、接入新主题
frontend/src/components/MonacoEditor.vue	同步接入

迁移 / 重启

仅前端构建部署。

验证方式

1. 打开文件管理 → 编辑 .php / .sh / .json / nginx.conf → 应看到彩色语法。
2. 工具栏「语法」切换为其他语言 → 高亮规则即时更新。
3. 主题切换按钮 → 深色/浅色主题下对比度正常。