无法在Angular 5中导入本地json文件

Question

我正在尝试导入本地文件以使用其中的数据。我已经尝试了require方法和import方法。似乎都不起作用。我正在使用Angular 5和Typescript 2.9.2。我被锁定在角度5。我正在为aot进行构建，当我查看导出的fesm5文件时，json文件似乎无法解析。（我不想用HTTP来插入它...）

import * as data from '../../assets/file.json';

当我尝试将tsconfig值设置为：

 "resolveJsonModule": true,

我在构建时遇到错误：

 Cannot read property 'slice' of undefined

 TypeError: Cannot read property 'slice' of undefined

at addReferencesToSourceFile (/Users/ME/Projects/PROJECT/node_modules/@angular/compiler-cli/src/transformers/compiler_host.js:520:54)

at TsCompilerAotCompilerTypeCheckHostAdapter.getSourceFile (/Users/ME/Projects/PROJECT/node_modules/@angular/compiler-cli/src/transformers/compiler_host.js:348:13)

我也尝试过：

declare module '*.json' {

  const value: any;

  export default value;

}

这似乎根本没有帮助。

还尝试了：

declare function require(url: string);

var data = require('../../assets/file.json');

这似乎也无法解析最终文件中的json。

Answer 1

您可以将文件放在资产文件夹下，并使用HttpClient模块中的HTTP GET获取它，这将返回整个json文件，并使用您的GET请求URL中的文件路径；像这样的东西：this.http.get('../assets/file.json')    .subscribe(jsonFormat => {       //Your code });