使用 TypeScript 在节点应用程序中导入 JSON 文件

Question

我真的快疯了，因为我找不到解决方案。 我要归档的是将带有配置的 JSON 文件导入我的 TypeScript 文件。 我知道我需要一个声明文件。所以我在我的项目中添加了一个文件 json-loader.d.ts 。我还在多个级别（根目录、typings 文件夹、custom_typings 文件夹）尝试了它，因为这是我找到的解决方案。 文件内容如下：

declare module "json!*" {
    let json: any;
    export = json;
}

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

但编译器仍然告诉我，无法导入 JSON 文件，因为它不是模块。 那么，编译器是如何知道有这样一个声明文件的呢？

我已经尝试像这样修改我的 tsconfig.json：

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "outDir": "dist",
    "typeRoots": [
      "./node_modules/@types",
      "./typings"
    ]
  },
  "include": [
    "src/**/*.ts"
  ],
  "exclude": [
    "node_modules"
  ]  
}

但它仍然不起作用。有什么建议吗？

谢谢！

Answer 1

Web 上使用 declare module "*.json" 的示例可以正常工作，因为 Webpack 被配置为加载 JSON 文件。

如果您不想为此烦恼，可以使用var 而不是import：

var json = require('../config.json');

as suggested in this answer

Answer 2

我已成功使用以下内容在 CLI 程序中导入我的 package.json（因此我可以在帮助页面中重复使用版本、许可证和描述信息）。

declare module '*.json' {
  const foo: {
    name: string;
    version: string;
    author: string;
    license: string;
    description: string;
  };
  export = foo;
}

或者，您可以导入包含接口描述等的其他文件，但您需要将导入放在模块声明中，例如

declare module 'ormconfig.json' {
  import { Connection } from "typeorm";

  const foo: Connection[];
  export = foo;
}

Answer 3

您是否做过类似在您的网页中添加 SystemJS 脚本来加载模块的操作 - index.html 等。我使用了 https://cdnjs.com/libraries/systemjs 和 iirc，您需要 https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.20.14/system.src.js System.JS 是模块加载器.. 必须是导入的第一个脚本。 然后你需要这样的东西：

    <script
   src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.20.14/system.src.js "/>
    <script>
       System.config({
         defaultJSExtension:true
       });
      System.import('pathtoscriptwithoutdotjsatend');
   </script>