Allow custom "outputPath" directory for each locale

[ibrcic]

🚀 Feature request

Command (mark with an x)

• build

Description

New version of Angular CLI allows us to use the new --localize option to generate different locales. This is great as it significantly reduces the build time for apps with many languages. However, as far as I can tell, the name of the output directory for each language is set to the name of the locale.
So if I have this locale defined:

"locales": { "foo-bar": { "translation": "src/i18n/messages.en-US.xlf" } }

the output directory for this locale would be /foo-bar.

Describe the solution you'd like

I would like to be able to specify outputPath per locale, ideally by just defining "outputPath" in each locale which would then be appended to existing build options outputPath.

Describe alternatives you've considered

Alternative is to just change name of the locale to the one I want. But this then creates a problem where LOCALE_ID is also changed. And I want my LOCALE_ID to be, for example en-US and my output directory of build to be /en.

[delrueba]

I've run into the same issue and wonder if it wouldn't make more sense to simply follow the baseHref property if present?

My settings in angular.json:

      "i18n": {
        "sourceLocale": {
          "code": "nl-BE",
          "baseHref": "nl"
        },
        "locales": {
          "fr-BE": {
            "baseHref": "fr",
            "translation": "src/i18n/messages.fr-BE.xlf"
          },
          "de-BE": {
            "baseHref": "de",
            "translation": "src/i18n/messages.de-BE.xlf"
          },
          "en-GB": {
            "baseHref": "en",
            "translation": "src/i18n/messages.en-GB.xlf"
          }
        }
      },

I've resolved into adding a postbuild script to rename the output directories,
but this seems hacky at best.

const fs = require('fs');

const outputPath = './dist/public/';
const directories = fs.readdirSync(outputPath, {withFileTypes: true})
  .filter(v => v.isDirectory())
  .map(dir => dir.name);

directories.forEach(dir => {
  try {
    fs.renameSync(outputPath + dir, outputPath + dir.substr(0, 2));
    console.log('\x1b[32m%s\x1b[0m', 'Successfully renamed the output directory ' + dir + ' to ' + dir.substr(0, 2));
  }
  catch (err) {
    console.log('\x1b[31m%s\x1b[0m', err);
  }
});

[stanislavromanov]

So a year have past and still you cannot specify your output directory per locale? I've ran into same problem, I don't need my directory to be en-US but us.

[brankoiliccc]

Can someone look into this? Solution provided by @delrueba does not works in every environment. Kubernetes mounted drives etc.
Im guessing this does not require a lot of effort but it costing developers hours and hours

[tkt028]

My problem: in my application the app locale is driven by browser cookie, because I don't want to expose the locale in app business URL.
I need either this issue or #17416 to be solved.
But both are still open. So sad!

[khmy2010]

can Angular core team add this feature? I would appreciate if the folder name can follow the base-href (in which, pretty make sense).

[c-goldschmidt]

Our application uses a similar approach as @tkt028 mentioned: we only set a cookie and let the server decide on the index template to serve. This means that per language, we need to generate a separate bundle.
i've setup 2 configurations using localize at first until i noticed that the options "deployUrl" and "outputPath" are not available for the localized bundles. i tried again with a different approach:

// prod
"deployUrl": "/static/en/",
"outputPath": "build/en",
"i18nFile": "src/locale/messages.en.xlf",
"i18nLocale": "en",

// prod-de
"deployUrl": "/static/de/",
"outputPath": "build/de",
"i18nFile": "src/locale/messages.de.xlf",
"i18nLocale": "de",

but when i run these configurations using ng build --configuration=prod,prod-de, all js files end up in the same folder (=> build/de) and i only get the "de" index.html.

[meriturva]

I hope the new feature request process is also for angular-cli https://blog.angular.io/new-feature-request-process-a9f69d106fc8.
am I right @mgechev ?

[mgechev]

We'll initially enable it for the framework repository and if it is successful consider it for CLI and components.

[itseramin]

Still not fixed? I want my default language setting in the root /dist folder and all the other locales in their seperate fodlers e.g. /dist/fr/... It builds wrongly, i can copy the files manually but when i use the ag-github-cli module i cant do it that way...