Angular 找不到 7 个 prod build i18n 文件

Question

我正在尝试部署 Angular 7 应用程序，该应用程序使用 /dist/assets 文件夹中的 ngx-translate 和翻译语言文件。我在构建中指定了正确的基本 href。部署后，我看到所有内容都加载了，除了语言文件 returns 错误代码 404（未找到）。

我试过用几种不同的方式更改 angular.json 文件。我尝试更改 TranslateHttpLoader。似乎没有任何效果。我可以在 /dist 文件夹中看到包含所有语言文件的 i18n 文件夹。但是它没有被引用。

在app.module.ts

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

在angular.json

"assets": [
  "src/favicon.ico",
  "src/assets"
],

但我最终在浏览器中收到此错误：

/assets/i18n/en.json 404 未找到

如有任何帮助，我们将不胜感激！

Answer 1

你导入AppModule了吗？

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

@NgModule({
    imports: [
        BrowserModule,
        HttpClientModule,
        TranslateModule.forRoot({
            loader: {
                provide: TranslateLoader,
                useFactory: HttpLoaderFactory,
                deps: [HttpClient]
            }
        })
    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

Answer 2

我遇到了和你一样的问题，我相信它与这个命令有关：

ng build --prod

尝试使用这个命令：

ng build --base-href=/deployed_app_name/ --prod

例如，如果您部署的应用程序名称是：Whosebug 命令应该是这样的：

ng build --base-href=/Whosebug/ --prod

在这里您将拥有指向您的 i18n json 文件的正确路径

Answer 3

这是我解决类似问题的路径：

检查404错误的文件是否在dist文件夹的正确路径中，如果不正确，请确认angular.json中所有资产参数是否正常。
将 base-ref 参数验证为：
然后查看 environment.prod.ts（或 environment.ts 等）的 i18n 参数中的值是否正确

Answer 4

在 Angular 9.0.4 我遇到了同样的问题。

只有当我在路径中有一个点斜杠前缀作为 ./assets/i18n/ 时，问题才会得到解决：

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

Answer 5

我遇到了和你一样的问题，在我的例子中，它在我的本地 IIS 服务器上工作得很好，但它为实时 IIS 服务器抛出 404（i18n/en。json 未找到 404）。

兜兜转转，以为是angular i18n路径错误。最后归结为服务器问题。

默认情况下 IIS 服务器将只允许少数文件扩展名类型。您必须为 json 文件（来自网络配置文件）手动添加 mimeType。

<staticContent>
  <remove fileExtension=".json"/>
  <mimeMap fileExtension=".json" mimeType="application/json"/>
</staticContent>

我将其添加到网络配置文件中（如果文件不存在，您必须在网站根文件夹中创建它）。

欢迎...

Angular 找不到 7 个 prod build i18n 文件

Angular 7 prod build i18n files not found

ngx-translate

ng-build

angular7