Импорт фиктивных данных для Angular

Question

Таким образом, я условно включаю HTTPInterceptor в свое приложение для предоставления имитационных данных в фиктивной среде (app.module.ts включает это:

import { fakeBackendProvider } from './mock-backend/fake-bakend';

// Snip

if (environment.mock) {
  // used to create fake bakend
  providers.push(fakeBackendProvider);
}

, и мне интересно, как лучше всего включить фиктивные данные (которые являются просто json файлами) в поддельном бэкэнде. В настоящее время я просто импортирую их в топ, так как это проще всего с наименьшим количеством кода:

import * as fakeData from './data.json';

однако я хочу быть уверен, что когда для environment.mock задано значение false и проект собран, этот код будет должным образом поврежден деревом и не будет включен в дистрибутив. Лучше условно импортировать файл, когда он мне нужен

import('./data.json').then(fakeData => {

});

Это немного сложнее, потому что я не могу просто использовать Observable.of и требует еще несколько строк кода (ничего страшного, но есть куча этих поддельных данных json файлов), или это будет включено в а также один файл dist, и мне действительно нужно использовать httpClient для загрузки данных из каталога активов?

Какова лучшая практика? или здесь, по крайней мере, из соображений, которые не приведут к тому, что мои фиктивные данные будут связаны с производством?

Answer 1

Я бы просто использовал http.get() и загрузил бы результат json на лету, например:

this.http.get('./assets/data.json').subscribe(data => {
  // lets assume you have a service for storing your mock data called "fakeDataProvider"
  this.fakeDataProvider.push(data);
});

Если, однако, вам нужно загрузить json данные до bootstrap вашего приложения, вы всегда можете использовать javascript fetch():

fetch('./assets/config.json')
.then(response => {
  return response.json().catch(error => {
    return Promise.reject(new BootstrapError(error, response));
}).then(config => {
  // set a global variable in your application
})

Загружая их через HTTP-запрос, вы можете быть уверены, что эти данные не будут включены в рабочий комплект.