浏览器 Accept-Language 与 navigator.language 不一致是因前者由语言偏好列表决定，后者仅反映 UI 语言；应通过 DevTools Network 面板验证真实请求头，Chrome/Firefox 中调整语言顺序并重启标签页，服务端需用标准库解析而非硬切。
浏览器语言设置不生效，navigator.language 和 Accept-Language 对不上怎么办
浏览器实际发送的 Accept-Language 请求头，不一定等于 navigator.language 的值——前者由浏览器语言偏好列表（含权重）决定，后者仅反映 UI 语言。调试时别只看 JS 控制台打印的 navigator.language。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 用浏览器 DevTools 的 Network 面板，点开任意请求 → Headers → 查看
Request Headers中的Accept-Language值（如zh-CN,zh;q=0.9,en;q=0.8） - Chrome 可在
chrome://settings/languages手动调整语言顺序并重启标签页；Firefox 在about:preferences#general→ “语言和外观”里设置 - 服务端若依赖此头做 locale 路由（如 Express 中用
req.headers['accept-language']），务必用标准解析库（如accept-language-parser或 Node.js 内置Intl.Locale）提取首选语言，别靠.split(',')[0]硬切
Webpack/Vite 项目里，i18n 模块热更新失效或翻译没刷新
常见于使用 i18next + i18next-browser-languagedetector 或 vue-i18n 的工程化项目。热更新（HMR）本身不触发 i18n 实例的资源重载，需显式监听。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- Vite 用户：在开发模式下，对
import.meta.hot监听 JSON 文件变更，调用i18n.addResourceBundle()或localeMessages.value = newMessages（Vue Composition API 场景） - Webpack 用户：配合
webpack-plugin-i18n或自定义插件，在compiler.hooks.emit阶段注入最新 locale JSON，并通过__webpack_require__.hot.accept触发 reload - 避免把翻译文件直接
import进组件——应统一由 i18n 实例管理，否则 HMR 无法感知模块依赖变化
Intl.DateTimeFormat 和 Intl.NumberFormat 在 Safari 里格式异常
Safari 对 Intl API 的 locale 支持较保守，尤其对非标准区域码（如 zh-Hans-CN）或带变体的标识符（如 en-GB-u-ca-gregory）容易 fallback 到默认 locale，导致日期/数字格式不符合预期。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 优先使用 BCP 47 标准格式（如
zh-CN、en-US），避免带-u-Unicode extension 的复杂 locale 字符串，除非明确需要（如农历日历） - 检测运行时支持：用
Intl.DateTimeFormat.supportedLocalesOf(['zh-CN'])返回数组长度判断是否可用，不可靠时降级为手动格式化 - 构建时若用
@formatjs/intl-datetimeformat或@formatjs/intl-numberformatpolyfill，注意它们不自动注入Intl全局对象，需显式调用require('@formatjs/intl-datetimeformat/polyfill')
CI/CD 环境中，npm run build 后多语言资源路径错乱或 404
问题根源通常是静态资源路径配置与部署路径不一致，尤其当应用部署在子路径（如 /app/）而非根路径时，public/locales 下的 JSON 文件请求地址变成 /locales/zh.json 而非 /app/locales/zh.json。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 检查构建输出的 HTML 中
<base href="/app/">是否存在且正确；Vite 用户确认vite.config.ts中base: '/app/'已设置 - i18next 初始化时，
backend.loadPath应写成相对路径（如'/locales/{{lng}}/{{ns}}.json'），而非绝对路径（'/app/locales/...'），让浏览器按当前<base>自动补全 - CI 构建后，用
curl -I https://your-domain.com/app/locales/zh/common.json验证真实返回状态码，别只信本地localhost测试结果
