Firebase托管未显示本地化版本

时间:2020-10-05 12:09:04

标签: angular firebase internationalization firebase-hosting

我想在http://myapp.com/en/下使用英语作为默认值,在http://myapp.com/ja/下使用日语作为默认值。 但是两者都以英语显示(默认)。我已经进行了更改,因此它应该重写为firebase.json文件中的dorrect语言文件夹,并且还将i18n根目录添加到与语言文件夹相同的位置(见下文)。

我已经在本地计算机上进行了服务和翻译工作的测试,但未部署prod(firebase)后进行测试。

在我的angular.json文件中,它看起来像这样。

 "i18n": {
    "sourceLocale": {
      "code": "en",
      "baseHref": "en"
    },
    "locales": {
      "ja": {
        "translation": "src/locale/messages.ja.xlf",
        "baseHref": "ja"
      }
    }
  },

在我服务时,它在本地效果很好。或ng serve --configuration =“ ja”。我的服务在angular.json中看起来像这样。

    "serve": {
    "builder": "@angular-devkit/build-angular:dev-server",
    "options": {
      "browserTarget": "myapp:build"
    },
    "configurations": {
      "production": {
        "browserTarget": "myapp:build:production"
      },
      "ja": {
        "browserTarget": "myapp:build:ja"
      }
    }
  },

现在,当我进行构建时,我会执行此操作。 ng build --prod --localize 我尝试使用aot = disabled来查看它是否有所不同,但没有。

从angular.json构建看起来像这样。

"build": {
    "localize": true,
    "builder": "@angular-devkit/build-angular:browser",
    "options": {
      "outputPath": "dist/myapp",
      "index": "src/index.html",
      "main": "src/main.ts",
      "polyfills": "src/polyfills.ts",
      "tsConfig": "tsconfig.app.json",
      "aot": true,
      "assets": [
        "src/favicon.ico",
        "src/assets"
      ],
      "styles": [
        "src/styles.css",
        "./node_modules/bootstrap/dist/css/bootstrap.min.css"
      ],
      "scripts": [
        "./node_modules/jquery/dist/jquery.min.js",
        "./node_modules/popper.js/dist/umd/popper.min.js",
        "./node_modules/bootstrap/dist/js/bootstrap.min.js"
      ]
    },
    "configurations": {
      "ja": {
        "localize": [
          "ja"
        ]
      },
      "production": {
        "fileReplacements": [
          {
            "replace": "src/environments/environment.ts",
            "with": "src/environments/environment.prod.ts"
          }
        ],
        "optimization": true,
        "outputHashing": "all",
        "sourceMap": false,
        "extractCss": true,
        "namedChunks": false,
        "extractLicenses": true,
        "vendorChunk": false,
        "buildOptimizer": false,
        "budgets": [
          {
            "type": "initial",
            "maximumWarning": "2mb",
            "maximumError": "5mb"
          },
          {
            "type": "anyComponentStyle",
            "maximumWarning": "6kb",
            "maximumError": "10kb"
          }
        ]
      }
    }
  },

现在,我的firebase.json看起来像这样:

    {
    "hosting": {
      "public": "./dist/myapp",
      "ignore": [
        "firebase.json",
        "**/.*",
        "**/node_modules/**"
      ],
      "rewrites": [
        {
          "source": "/ja/**",
          "destination": "/ja/index.html"
        },
        {
          "source": "/en/**",
          "destination": "/en/index.html"
        }
      ],
      "i18n": {
        "root": "/"
      }
    }
  }

因此,我可以在/ en /和/ ja /处都访问该应用程序,但是ja没有翻译。关于我在做什么的任何指示都比我最近提出的要多得多,您应该将本地化文件夹放在单独的文件夹中,并将其放在根文件夹中?通过这些设置,我觉得它应该可以工作,但是显然有些错误。

1 个答案:

答案 0 :(得分:0)

移除

"baseHref": "en" 

"baseHref": "ja" 
在i18n下的angular.json文件中的

使其正常工作!我误会了baseHref的作用!