Angular使用ngx-translate生产环境找不到i18n json文件如何解决？

• 先验证翻译文件访问状态
  部署完成后直接在浏览器地址栏访问对应语言的翻译文件地址，格式为https://你的站点域名/assets/i18n/[语言标识].json，根据返回的错误码定位问题：
  • 返回404：优先排查路径配置、文件打包问题
  • 返回403/禁止访问：优先排查Azure静态资源权限、MIME类型配置
• 检查angular.json资源打包配置
  确认angular.json中projects -> [你的项目名] -> architect -> build -> options -> assets数组中包含"src/assets"配置，缺失的话构建时不会将i18n目录下的json文件打包到dist产物中，部署后自然无法加载。
• 修正Translate模块完整配置
  你已配置加载工厂函数，需确认AppModule中TranslateModule的初始化配置完整，示例如下：

  TranslateModule.forRoot({
    loader: {
      provide: TranslateLoader,
      useFactory: HttpLoaderFactory,
      deps: [HttpClient]
    },
    defaultLanguage: 'zh' // 替换为你的默认语言
  })
  

• 适配站点路径配置
  • 如果你的应用没有部署在站点根目录，执行生产构建时需添加--base-href参数指定部署路径，比如ng build --prod --base-href /your-app-path/
  • 将加载工厂中的资源路径改为相对路径，避免强制从根路径查找资源：

  export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
    return new TranslateHttpLoader(http, "./assets/i18n/", ".json");
  }
  

• 配置Azure WebApp静态资源规则
  Azure WebApp默认使用IIS托管，默认可能未配置json文件的MIME映射，需在项目src目录下新增web.config文件，构建后会自动打包到dist根目录，配置示例如下：

  <?xml version="1.0" encoding="utf-8"?>
  <configuration>
    <system.webServer>
      <staticContent>
        <mimeMap fileExtension=".json" mimeType="application/json" />
      </staticContent>
      <rewrite>
        <rules>
          <rule name="Angular Routes" stopProcessing="true">
            <match url=".*" />
            <conditions logicalGrouping="MatchAll">
              <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
              <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
            </conditions>
            <action type="Rewrite" url="./index.html" />
          </rule>
        </rules>
      </rewrite>
    </system.webServer>
  </configuration>
  

• 检查生产环境构建参数
  确认构建时没有开启会删除未引用资源的过度优化配置，避免翻译文件被误删。

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