在打字稿中读取本地 JSON 文件

问题描述

如何将本地存储的 JSON 文件读入打字稿中的变量？我有一个看起来像这样的照片 json 文件：

[
    {
      "id": 1,"camera": "","location": "","iso": 0,"aperture": 0,"focal length": 0
    },{
      "id": 2,{
      "id": 3,"focal length": 0
    }
]

我试图将文件作为文本读取，然后使用 Json.Parse 但我首先如何将其作为文本读取？我试过使用 FileReader.readAsText 但它只接受 blob 对象。我需要从我的文件路径创建一个 blob 对象还是有更简单的方法来读取本地 JSON 文件？

解决方法

如果您不希望文件发生变化，您可以使用 require('path') 来获取它。它应该只返回对象；不需要 JSON.parse。

,

可以导入json文件

import all from '../../path/to/file.json'

然后声明如下输入

const samples = (all as DataType)

,

您可以这样做，但需要修改tsconfig.json。 在 tsconfig.json 中有一个名为 resolveJsonModule 的设置。默认情况下，其值设置为 false。

TL;博士

1. 打开 tsconfig.json，如果 resolveJsonModule 中不存在 compilerOptions，则添加如下：

"resolveJsonModule": true,

2. 打开要读取文件的组件并像这样导入：

import * as photos from '../../path-to file';

以上更改足以导入文件。

示例如下：Stackblitz Example

,

您需要将此添加到您的 tsconfig

RandomNumber

然后像导入任何模块一样导入它

compilerOptions: { ... 
  "resolveJsonModule": true,}