如何在TypeScript中导入package.json？

Question

我正在尝试在TypeScript中导入我的package.json文件,它似乎不起作用.具体来说,我只是尝试导入它,以便我可以访问日志语句的名称和版本属性.就像是:

import * as pjson from '../package.json';
// other code here
log.info(`${pjson.name}:${pjson.version}` started on port ...);

我们在其他使用Node/Babel的项目中使用相同的语法,但我试图在这些部分周围引入一些TypeScript.在其他地方,我们会做类似的事情:

import { name, version} from '../package.json';

然而,这在这里不起作用.我按照https://www.npmjs.com/package/json-d-ts上的说明操作,这至少使我的import语句出错,但现在当我尝试访问属性时,我收到以下错误:

src/index.ts(20,21): error TS2339: Property 'name' does not exist on type 'typeof import("*.json")'.
src/index.ts(20,35): error TS2339: Property 'version' does not exist on type 'typeof import("*.json")'.

有没有办法解决这个问题,或者我只是必须在某处硬编码这些值(而不是从package.json中动态检索它们)？也许我可以用import("*.json")某种方式声明一个类型,并在其上定义这些属性？

Answer 1

如何导入* .json？

正如已经回答的那样，您需要Typescript> = 2.9以及以下设置tsconfig.json：

{
  "resolveJsonModule": true,
  "esModuleInterop": true,
  "module": "commonjs"
}

但是有一些限制：

• 您必须编译为CommonJS
• 您所有导入的JSON必须位于 "rootDir"

不幸的"rootDir"是，通常是package.json 下的文件夹，例如“ ./src”，否则可能会失败。

所以：
如何导入package.json？您可以require它：
const pjson = require('../package.json');

如果您使用npm.start：则不需要：

package.json字段添加到npm_package_前缀。因此，例如，如果您在package.json文件中有{“ name”：“ foo”，“ version”：“ 1.2.5”}，那么您的软件包脚本会将npm_package_name环境变量设置为“ foo”，并将npm_package_version设置为“ 1.2.5”。您可以使用process.env.npm_package_name和process.env.npm_package_version等在代码中访问这些变量，以此类推。

Answer 2

Typescript 应该能够执行以下操作：

import * as pack from "../package.json"

// access name and version like this:

console.log(pack.name);

查看支持类型正确的 JSON 导入下的第三个灰色框。
https://blogs.msdn.microsoft.com/typescript/2018/05/31/announcing-typescript-2-9/#json-imports

Answer 3

1. 确保 tsconfig.json 编译器选项包含：

   "resolveJsonModule": true, "esModuleInterop": true, "module": "commonjs"

2. 使用类型导入 package.json

   import * as pack from '../package.json';

Answer 4

从TypeScript 2.9开始,您可以导入JSON文件,如下所述: typescriptlang documentation 2.9#json,为此您需要在tsconfig.json中启用"resolveJsonModule"选项.

您需要在项目中使用typescript version 2.9:

npm i typescript@latest --save 要么 yarn add typescript

如果要从命令行构建打字稿文件tsc,则需要在全局安装最新的打字稿版本:

npm i -g typescript@latest 要么 yarn global add typescript

如果您正在构建项目,webpack并且webpack-dev-server需要确保json文件webpack-dev-server作为静态文件托管在上下文中.即使您托管它们,也不能import像这样在Web环境中使用json文件,您需要json使用ajax请求加载文件并解析响应JSON.parse.

Answer 5

npm 将package.json属性导出为带有前缀的 env vars，npm_package_如npm docs 中所述
因此，如果您使用的是 npm，则可以获得版本为process.env.npm_package_version