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

从TypeScript 2.9开始，您可以按照此处的说明导入JSON文件： typescriptlang documentation 2.9#json，为此您需要启用＆＃34; resolveJsonModule＆＃34; tsconfig.json中的选项。

您的项目需要打字稿版本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上下文中。即使您托管了它们，也不能像这样在Web环境中import json文件，您需要使用json请求加载ajax文件并解析回复JSON.parse。

Answer 2

如何导入* .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：you don't need to :

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 3

Typescript应该能够按如下方式执行：

import package from "../package.json"

// access name and version like this:

console.log(package.name);

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

Answer 4

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

"resolveJsonModule": true, "esModuleInterop": true, "module": "commonjs"
使用键入
导入package.json
import * as pack from '../package.json';

Answer 5

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

如何在TypeScript中导入package.json？

5 个答案: