如何限制 `resolveJsonModule` 的范围？

Question

我正在开发使用 Typescript 和 webpack 的项目。我必须导入 json 个文件，我必须以两种方式进行：

我必须将项目的 package.json 作为模块导入。这已经在之前实现了。
必须导入一些 json 模式作为 url 可加载的资源。这就是我现在正在做的事情。

使用`package.json`（已经实施）

要导入 package.json，tsconfig.json 包含：

{
  "compilerOptions": {
    "resolveJsonModule": true,
    "paths": {
      "package.json": ["./package.json"]
    }
  },
}

并且 webpack 配置有：

  /**
   * Determine the array of extensions that should be used to resolve modules.
   */
  resolve: {
    extensions: [".js", ".ts", ".tsx", ".json"],
    plugins: [
      new TSConfigPathsPlugin({
        configFile: path.join(__dirname, "../../tsconfig.json"),
        logLevel: "info",
        extensions: [".js", ".jsx", ".ts", ".tsx"],
        mainFields: ["browser", "main"],
        baseUrl: tsConfig.baseUrl,
      }),
    ],
  },

这就是 package.json 的用法：

import packageJson from "package.json";

//...

const release = `${packageJson.version}-${process.platform}`;

这是完全类型安全的：ts 检查我的 package.json 有 version 字段。这是按预期工作的，我不想破坏它。

使用模式 json 文件（我正在实施的）

为了添加对 json 模式的支持，我添加了与 .schema.json$ 匹配的文件名并将其添加到 webpack 配置中：

  module: {
    rules: [
      {
        test: /\.schema.json$/,
        type: "asset/resource",
      },
    ],
  },

并且这是一个全局类型声明文件：

declare module "*.schema.json" {
  declare const uri: string;
  export default uri;
}

我认为通过这样做，Typescript 会将导入这样的文件解释为一个简单的字符串。我一直在关注 this example.

但是，当我在我的项目中导入架构文件时：

import someSchemaUri from "./schemas/some-name.schema.json";

// ...

uri = someSchemaUri;

我仍然遇到类型错误：

Type '{ ... }' is not assignable to type 'string'.

改变`resolveJsonModule`

如果我将 resolveJsonModule 选项设置为 false,，这个问题就会消失，但是从上一节导入 package.json 会开始出现错误：

Module 'package.json' was resolved to 'secret/path/package.json', but '--resolveJsonModule' is not used.

如何配置我的项目，以便 Typescript 将这些文件解释为 string，但在某些情况下，当我从上一节导入 package.json 时，不会失去类型安全性？

Answer 1

据我所知，一旦设置了 --resolveJsonModule，就无法覆盖 json 类型。您可以考虑禁用该标志并手动为 package.json 写入类型吗？它不是 time-consuming，因为您只使用了一个 package.json 字段。

declare module '*.schema.json' {
    const uri: string;
    export default uri;
}

declare module '*package.json' {
    const content: {
        version: string;
    };
    export default content;
}

如何限制 `resolveJsonModule` 的范围？

How do I limit the scope of `resolveJsonModule`?

json

typescript

webpack

使用`package.json`（已经实施）

使用模式 json 文件（我正在实施的）

改变`resolveJsonModule`

如何限制 `resolveJsonModule` 的范围？

How do I limit the scope of `resolveJsonModule`?

json

typescript

webpack

使用package.json（已经实施）

使用模式 json 文件（我正在实施的）

改变resolveJsonModule

使用`package.json`（已经实施）

改变`resolveJsonModule`