title: How do I 'ng serve' the original app after localizing it with @angular/localize?
body: <p>I was playing with Angular's localization @angular/localize and after configuring it to translate the app to different language <strong>I tried to serve the default version of it using 'ng serve'</strong> but I get this error:</p>
  <pre><code>An unhandled exception occurred: The development server only supports localizing a single locale per build.
  </code></pre>
  <p>I tried it with different port based on this: <a href="https://stackoverflow.com/questions/60683954/how-to-serve-different-angular-locales-during-development-using-ng-serve">How to serve different Angular locales during development using ng serve?</a> but to no avail.</p>
  <p>For the translated version everything <strong>works</strong> using 'ng serve --configuration=fr'.
  Builds <strong>work</strong> correctly creating 'en-US' and 'fr' folders in dist/App folder.</p>
  <p>When I removed the inlineLocales.size condition in dev-server everything worked fine, no errors:</p>
  <pre><code>if (i18n.shouldInline &amp;&amp; tsConfig.options.enableIvy !== false) {
      //if (i18n.inlineLocales.size &gt; 1) {
      //    throw new Error('The development server only supports localizing a single locale per build');
      //}
      await setupLocalize(i18n, browserOptions, webpackConfig);
  }
  </code></pre>
  <p>So it may be Angular-devkit issue.</p>
  <p>I tried to work around by creating new &quot;en-US&quot; locale but got this error:</p>
  <pre><code>An unhandled exception occurred: An i18n locale ('en-US') cannot both be a source locale and provide a translation.
  </code></pre>
  <p>After using just 'en' instead of 'en-US' and creating new translation file with <code>&lt;source&gt;</code> and <code>&lt;target&gt;</code> translation being the same it works using 'ng serve --configuration=en' but it looks like a wrong solution.</p>
  <p>Here is my angular.json:</p>
  <pre><code>{
    &quot;$schema&quot;: &quot;./node_modules/@angular/cli/lib/config/schema.json&quot;,
    &quot;version&quot;: 1,
    &quot;newProjectRoot&quot;: &quot;projects&quot;,
    &quot;projects&quot;: {
      &quot;App&quot;: {
        &quot;projectType&quot;: &quot;application&quot;,
        &quot;i18n&quot;: {
          &quot;sourceLocale&quot;: &quot;en-US&quot;,
          &quot;locales&quot;: {
            &quot;fr&quot;: &quot;src/locale/messages.fr.xlf&quot;
          }
        },
        &quot;schematics&quot;: {
          &quot;@schematics/angular:component&quot;: {
            &quot;style&quot;: &quot;scss&quot;
          },
          &quot;@schematics/angular:application&quot;: {
            &quot;strict&quot;: true
          }
        },
        &quot;root&quot;: &quot;&quot;,
        &quot;sourceRoot&quot;: &quot;src&quot;,
        &quot;prefix&quot;: &quot;app&quot;,
        &quot;architect&quot;: {
          &quot;build&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:browser&quot;,
            &quot;options&quot;: {
              &quot;localize&quot;: true,
              &quot;outputPath&quot;: &quot;dist/App&quot;,
              &quot;index&quot;: &quot;src/index.html&quot;,
              &quot;main&quot;: &quot;src/main.ts&quot;,
              &quot;polyfills&quot;: &quot;src/polyfills.ts&quot;,
              &quot;tsConfig&quot;: &quot;tsconfig.app.json&quot;,
              &quot;aot&quot;: true,
              &quot;assets&quot;: [&quot;src/favicon.ico&quot;, &quot;src/assets&quot;],
              &quot;styles&quot;: [&quot;src/styles.scss&quot;],
              &quot;scripts&quot;: []
            },
            &quot;configurations&quot;: {
              &quot;production&quot;: {
                &quot;fileReplacements&quot;: [
                  {
                    &quot;replace&quot;: &quot;src/environments/environment.ts&quot;,
                    &quot;with&quot;: &quot;src/environments/environment.prod.ts&quot;
                  }
                ],
                &quot;optimization&quot;: true,
                &quot;outputHashing&quot;: &quot;all&quot;,
                &quot;sourceMap&quot;: false,
                &quot;extractCss&quot;: true,
                &quot;namedChunks&quot;: false,
                &quot;extractLicenses&quot;: true,
                &quot;vendorChunk&quot;: false,
                &quot;buildOptimizer&quot;: true,
                &quot;budgets&quot;: [
                  {
                    &quot;type&quot;: &quot;initial&quot;,
                    &quot;maximumWarning&quot;: &quot;500kb&quot;,
                    &quot;maximumError&quot;: &quot;1mb&quot;
                  },
                  {
                    &quot;type&quot;: &quot;anyComponentStyle&quot;,
                    &quot;maximumWarning&quot;: &quot;2kb&quot;,
                    &quot;maximumError&quot;: &quot;4kb&quot;
                  }
                ]
              },
              &quot;fr&quot;: {
                &quot;localize&quot;: [&quot;fr&quot;]
              }
            }
          },
          &quot;serve&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:dev-server&quot;,
            &quot;options&quot;: {
              &quot;browserTarget&quot;: &quot;App:build&quot;
            },
            &quot;configurations&quot;: {
              &quot;production&quot;: {
                &quot;browserTarget&quot;: &quot;App:build:production&quot;
              },
              &quot;fr&quot;: {
                &quot;browserTarget&quot;: &quot;App:build:fr&quot;
              }
            }
          },
          &quot;extract-i18n&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:extract-i18n&quot;,
            &quot;options&quot;: {
              &quot;browserTarget&quot;: &quot;App:build&quot;
            }
          },
          &quot;test&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:karma&quot;,
            &quot;options&quot;: {
              &quot;main&quot;: &quot;src/test.ts&quot;,
              &quot;polyfills&quot;: &quot;src/polyfills.ts&quot;,
              &quot;tsConfig&quot;: &quot;tsconfig.spec.json&quot;,
              &quot;karmaConfig&quot;: &quot;karma.conf.js&quot;,
              &quot;assets&quot;: [&quot;src/favicon.ico&quot;, &quot;src/assets&quot;],
              &quot;styles&quot;: [&quot;src/styles.scss&quot;],
              &quot;scripts&quot;: []
            }
          },
          &quot;lint&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:tslint&quot;,
            &quot;options&quot;: {
              &quot;tsConfig&quot;: [
                &quot;tsconfig.app.json&quot;,
                &quot;tsconfig.spec.json&quot;,
                &quot;e2e/tsconfig.json&quot;
              ],
              &quot;exclude&quot;: [&quot;**/node_modules/**&quot;]
            }
          },
          &quot;e2e&quot;: {
            &quot;builder&quot;: &quot;@angular-devkit/build-angular:protractor&quot;,
            &quot;options&quot;: {
              &quot;protractorConfig&quot;: &quot;e2e/protractor.conf.js&quot;,
              &quot;devServerTarget&quot;: &quot;App:serve&quot;
            },
            &quot;configurations&quot;: {
              &quot;production&quot;: {
                &quot;devServerTarget&quot;: &quot;App:serve:production&quot;
              }
            }
          }
        }
      }
    },
    &quot;defaultProject&quot;: &quot;App&quot;
  }
  </code></pre>
  <p>How to reproduce:
  The app is generated using Angular CLI 10.0.0 and Angular 10.0.1 and then adding @angular/localize by 'ng add @angular/localize'. In app.component.html is single <code>&lt;h1 i18n=&quot;@@app.h1&quot;&gt;Hello&lt;/h1&gt;</code>. Using the angular.json above.</p>