i18n интернационализация, как обслуживать или строить для нескольких языков

Question

    {
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "angular.io-example": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      "schematics": {},
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              "src/favicon.ico",
              "src/assets"
            ],
            "styles": [
              "src/styles.css"
            ],
            "scripts": []
          },
          "configurations": {
            "production": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true
            },
            "production-fr": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "outputPath": "dist/my-project-fr/",
              "i18nFile": "src/locale/messages.fr.xlf",
              "i18nFormat": "xlf",
              "i18nLocale": "fr",
              "i18nMissingTranslation": "error"
            },
            "fr": {
              "aot": true,
              "outputPath": "dist/my-project-fr/",
              "baseHref": "/fr/",
              "i18nFile": "src/locale/messages.fr.xlf",
              "i18nFormat": "xlf",
              "i18nLocale": "fr",
              "i18nMissingTranslation": "error"
            }
          }
        },
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "angular.io-example:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "angular.io-example:build:production"
            },
            "fr": {
              "browserTarget": "angular.io-example:build:fr"
            }
          }
        },

Это мой angular.json, и я использую ng serve --configuration=fr, который работает только для определенного языка, но я хочу работать между два язык один по умолчанию английский и другой язык, как если бы я localhost:4200 Я хочу английский, и если я добавлю URL localhost:4200/fr/, он должен показать другой язык.

Как этого добиться?

Answer 1

нг подача / сборка на разных языках невозможна. Для этого есть открытый выпуск .

Так что вы не можете сделать это с помощью angular. С Angular вы можете создать свое приложение на разных языках. Просто добавьте сценарии в ваш package.json. E.g.:

"scripts": {
  "ng": "ng",
  // ..other scripts
  "build:fr": "ng build --aot --configuration=production-fr",
  "build:en": "ng build --aot --configuration=production-en",
  "build-all": "npm run build:fr && npm run build:en",
},

Эти приложения должны быть развернуты на HTTP-сервере, который используется для таких вещей (например, Apache с Правилами перезаписи или nginx с Переписать правила

Я не могу написать разные конфигурации для всех серверов, но вот пример конфигурации для nginx (не проверено, но оно должно дать вам представление)

worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    server {
        listen       80;
        server_name  localhost;

        location /en/ {
             autoindex on;
             try_files $uri$args $uri$args/ /en/index.html;
        }

        location /fr/ {
            autoindex on;
            try_files $uri$args $uri$args/ /fr/index.html;
        }

        # Default to EN
        location / {
            try_files $uri$args /en/index.html;
        }
    }
}

если вам нужна дополнительная помощь, пожалуйста, добавьте сервер, который вы используете