导入表单和模块声明需要就模块的形状以及它导出的内容达成一致。

当你编写(导入JSON的次优做法，因为TypeScript 2.9在目标兼容模块格式时，请参阅注释)

declare module "*.json" {
  const value: any;
  export default value;
}

您正在声明所有以.json结尾的说明符的模块都有一个名为default的导出。

有几种方法可以正确地使用这样的模块，包括

import a from "a.json";
a.primaryMain

and

import * as a from "a.json";
a.default.primaryMain

and

import {default as a} from "a.json";
a.primaryMain

and

import a = require("a.json");
a.default.primaryMain

第一种形式是最好的，它所利用的语法糖正是JavaScript拥有默认导出的原因。

不过，我提到了其他表单，以提示您哪里出了问题。特别注意最后一个。Require为您提供了一个表示模块本身的对象，而不是它导出的绑定。

那么为什么会出现错误呢?因为你写了

import a = require("a.json");
a.primaryMain

但是你的“*.json”并没有声明名为primaryMain的导出。

所有这些都假设您的模块加载器按照原始声明的建议提供JSON作为默认导出。

注意:从TypeScript 2.9开始，你可以使用——resolveJsonModule编译器标志来让TypeScript分析导入的.json文件，并提供关于其形状的正确信息，从而避免了通配符模块声明和验证文件的存在。某些目标模块格式不支持这一点。

另一种方法

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

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

例如，自定义类型json。

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

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

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

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

使用typescript 2.9+版本很容易。因此，您可以轻松地导入JSON文件@kentor描述。

但如果你需要使用旧版本:

你可以用更多的TypeScript方式访问JSON文件。首先，确保新的typings.d.ts位置与tsconfig中的include属性相同。json文件。

如果在tsconfig中没有include属性。json文件。然后你的文件夹结构应该是这样的:

- app.ts
+ node_modules/
- package.json
- tsconfig.json
- typings.d.ts

但是如果你在tsconfig.json中有一个include属性:

{
    "compilerOptions": {
    },
    "exclude"        : [
        "node_modules",
        "**/*spec.ts"
    ], "include"        : [
        "src/**/*"
    ]
}

然后你的typings.d.ts应该在src目录中，如include属性所述

+ node_modules/
- package.json
- tsconfig.json
- src/
    - app.ts
    - typings.d.ts

在许多响应中，您可以为所有JSON文件定义一个全局声明。

declare module '*.json' {
    const value: any;
    export default value;
}

但我更喜欢打字的版本。例如，假设您有配置文件config。这样的Json:

{
    "address": "127.0.0.1",
    "port"   : 8080
}

然后我们可以为它声明一个特定的类型:

declare module 'config.json' {
    export const address: string;
    export const port: number;
}

它很容易在你的typescript文件中导入:

import * as Config from 'config.json';

export class SomeClass {
    public someMethod: void {
        console.log(Config.address);
        console.log(Config.port);
    }
}

但是在编译阶段，您应该手动将JSON文件复制到dist文件夹。我只是向我的包添加了一个脚本属性。json配置:

{
    "name"   : "some project",
    "scripts": {
        "build": "rm -rf dist && tsc && cp src/config.json dist/"
    }
}

使用TypeScript 2.9。+你可以简单地导入JSON文件，这样做有类型安全和智能感知的好处:

import colorsJson from '../colors.json'; // This import style requires "esModuleInterop", see "side notes"
console.log(colorsJson.primaryBright);

确保在tsconfig的compilerOptions部分添加这些设置。json(文档):

"resolveJsonModule": true,
"esModuleInterop": true,

边注:

Typescript 2.9.0在这个JSON特性上有一个bug，它在2.9.2被修复了 esModuleInterop只对colorsJson的默认导入是必需的。如果你将其设置为false，那么你必须使用import * as colorsJson从'../colors.json'导入它

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