在一个Angular (typescript)应用中，我需要在我的environment.ts中包含一个.json文件。要做到这一点，我必须在tsconfig中设置两个选项:

{
  "compilerOptions": {
    "moduleResolution": "node",
    "resolveJsonModule": true
  }
}

然后，我可以将我的json文件导入到environment.ts:

import { default as someObjectName } from "../some-json-file.json";

通常在Node.js应用程序中需要一个.json。在TypeScript 2.9中，——resolveJsonModule允许从.json文件中导入、提取类型并生成。

例#

// tsconfig.json { "compilerOptions": { "module": "commonjs", "resolveJsonModule": true, "esModuleInterop": true } } // .ts import settings from "./settings.json"; settings.debug === true; // OK settings.dry === 2; // Error: Operator '===' cannot be applied boolean and number // settings.json { "repo": "TypeScript", "dry": false, "debug": false } by: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-9.html

下面是如何在运行时导入json文件

import fs from 'fs'
var dataArray = JSON.parse(fs.readFileSync('data.json', 'utf-8'))

这样就避免了在导入大文件时tsc变慢或内存不足的问题，这些问题都可能发生在使用resolveJsonModule时。

在我的情况下，我需要改变tsconfig.node.json:

{
  "compilerOptions": {
    ...
    "resolveJsonModule": true
  },
  "include": [..., "colors.json"]
}

像这样导入:

import * as colors from './colors.json'

或者像这样:

import colors from './colors.json'

with "esModuleInterop": true

在我的情况下，我必须改变:"include": ["src"]到"include":["。除了“resolveJsonModule”:true，因为我试图导入manifest。Json来自项目的根目录，而不是来自。/src

另一种方法

const data: {[key: string]: any} = require('./data.json');

你仍然可以定义json类型，不需要使用通配符。

例如，自定义类型json。

interface User {
  firstName: string;
  lastName: string;
  birthday: Date;
}
const user: User = require('./user.json');