title: json language files are not found ngx-translate angular-cli
body: <p>My project is set up with Angular CLI, so it's built with webpack but the webpack config files are hidden.</p>
  
  <p>I got two files, <code>nl.json</code> and <code>fr.json</code>, but get a <code>404</code> for both, even though it looks like it's going to the correct folder: <code>http://localhost:4200/i18n/nl.json</code>. </p>
  
  <p>They have this structure:</p>
  
  <pre><code>{
    "SEARCH_PAGE": {
      "searchPerson": "Zoek een persoon",
      "search": "Zoek"
    }
  }
  </code></pre>
  
  <p>In <code>app.module</code>:</p>
  
  <pre><code>...
   TranslateModule.forRoot({
        loader: {
            provide: TranslateLoader,
            useFactory: HttpLoaderFactory,
            deps: [Http]
        }
      }),
  ...
  </code></pre>
  
  <p>and </p>
  
  <pre><code>export function HttpLoaderFactory(http: Http) {
      return new TranslateHttpLoader(http, "/i18n/", ".json");
  }
  </code></pre>
  
  <p>I also include these in my sub module where I [try to] use the translation, with the difference of <code>.forChild</code> instead of <code>.forRoot</code>.</p>
  
  <p>In my component:</p>
  
  <pre><code>  constructor(translate: TranslateService) {
      translate.addLangs(["nl", "fr"]);
      translate.setDefaultLang('nl'); // this language will be used as a fallback when a translation isn't found in the current language
  
      let browserLang: string = translate.getBrowserLang();
      translate.use(browserLang.match(/nl|fr/) ? browserLang : 'nl');
    }
  </code></pre>
  
  <p>Could it be something not linked to <code>ngx-translate</code> ?
  When I use the pipe <code>&lt;h1&gt;{{ 'SEARCH_PAGE.searchPerson' | translate}}&lt;/h1&gt;</code> I get nothing on the screen, when I use the directive <code>&lt;h1 translate]="'SEARCH_PAGE.searchPerson'"&gt;&lt;/h1&gt;</code> I get literally the string.</p>