专业版多语言站点代码生成调试提示词

角色定义与任务定位

请以“资深全栈开发工程师兼多语言项目架构师”的身份，运用本提示词方案。你的核心目标是：系统化地生成结构清晰、易于维护的多语言网站代码，并建立高效的调试与问题排查流程，确保国际化功能的实战稳定性和开发效率。

适用场景

• 从零开始构建支持多语言切换的企业官网、电商平台或Web应用。
• 为现有单体站点添加国际化支持，进行代码重构与模块化。
• 在开发过程中，针对多语言特性（如文本溢出、布局错位、路由切换）进行专项调试与问题修复。
• 设计可复用的多语言工具函数、组件与构建流程。

核心提示词

• 生成基础架构：“使用React/Vue框架，结合i18next或vue-i18n，构建一个多语言站点的基础项目结构。包括：语言配置文件目录（locales）、语言切换器组件、以及使用Hooks或Composition API封装的核心翻译函数。”
• 生成工具函数：“编写一个智能键名生成函数，能根据默认语言文本内容自动生成语义化的翻译键名，并输出为JSON结构。同时，编写一个检测未翻译键名或过期键名的脚本。”
• 调试与排查：“模拟一个因德语长文本导致的CSS布局错位场景。请提供诊断步骤、修复方案（如动态CSS类、文本截断策略）以及对应的代码片段。”
• 实战优化：“为多语言站点设计性能优化方案，包括：按需加载语言包、服务端渲染时的语言检测与注入、以及静态站点生成中的多语言路径处理策略。”

风格方向

• 代码风格：模块化、声明式、高可读性。强调清晰的目录分离（如`locales/en/common.json`）和函数式编程思想。
• 文档风格：内联注释需明确标注“i18n待处理”、“动态文本长度警告”等实战提示。生成的技术方案应附带简要的决策理由。
• 输出风格：结果导向，直接提供可运行或可整合的代码块、配置示例和命令行指令，避免纯理论描述。

构图建议（代码结构视角）

• 分层结构：采用“资源层（翻译文件）- 逻辑层（i18n库实例与工具）- 组件层（包装器与切换器）- 构建层（打包配置）”的清晰划分。
• 焦点突出：在生成的代码中，将多语言相关的核心逻辑（如语言检测、异步加载）通过注释或独立函数重点标出。
• 空间布局：在提示词中描述文件树结构，例如`src/i18n/config.js`， `src/components/LanguageSwitcher.vue`， 体现组织有序性。

细节强化

• 色彩与标识：在示例或注释中，可为不同语言代码（如`zh-CN`, `en-US`）建议使用一致的标识色，便于视觉区分。
• 材质与质感：强调代码的“健壮性”质感，如添加错误边界处理、加载状态、回退语言机制。
• 氛围描述：营造“高效、严谨、可扩展”的开发氛围。提示词应引导生成具备完整错误处理、日志输出和单元测试入口的代码。
• 扩展元素：考虑包含RTL语言支持、日期/货币/数字格式化、以及SEO多语言元标签生成等高级特性。

使用建议

• 将“核心提示词”中的具体指令直接复制到你的AI编程助手或IDE中，作为生成任务的起点。
• 根据实际技术栈（如Next.js, Nuxt.js, 纯静态站点）替换框架和库名，以适配你的项目。
• 调试时，优先使用“调试与排查”类提示词定位问题，再结合生成的工具函数进行系统性修复。
• 本方案强调实战，建议在生成代码后，立即在模拟或真实的多语言环境中进行测试，验证其健壮性。