Angular本地导入语言报错：./locales未在package.json导出，求解决

核心解决方案 #

不要直接导入整个@angular/common/locales目录，而是针对每个语言动态导入具体的语言包文件，示例代码如下：

import { registerLocaleData } from '@angular/common';

const targetLanguages = ['zh-Hans', 'en', 'fr', 'de'];

// 遍历并动态导入对应语言包
targetLanguages.forEach(async (lang) => {
  // 导入具体语言的locale模块
  const localeModule = await import(`@angular/common/locales/${lang}`);
  // 注册语言环境数据
  registerLocaleData(localeModule.default);
});

问题根源解析 #

• Angular的@angular/common包在package.json的exports字段中，并未将./locales目录作为公开导出的入口，所以直接用正斜杠导入整个目录时，构建工具会严格检查包的导出规范，触发"./locales is not exported in package.json"报错。
• 反斜杠能临时"工作"是因为它不是ES模块导入的规范路径分隔符，构建工具（如Angular CLI/Webpack）会将其解析为特殊的本地路径逻辑，绕过了包导出检查，但这属于非规范写法，可能在不同环境下出现兼容性问题，不建议使用。

额外注意事项 #

• 确认语言包的文件名正确：Angular的locale文件命名遵循标准语言代码（如简体中文是zh-Hans，英文是en），可以在node_modules/@angular/common/locales目录下查看所有可用的语言文件。
• 确保你的Angular版本支持动态导入：Angular 8+默认支持import()动态导入语法，无需额外配置。

内容的提问来源于stack exchange，提问作者TechDev08979