【问题标题】:Typescript runtime error: cannot read property of undefined (enum)打字稿运行时错误:无法读取未定义(枚举)的属性
【发布时间】:2018-10-26 04:42:38
【问题描述】:

我在文件RESTConfig.ts中有以下接口和枚举:

export const enum RESTMethod {
   POST = "POST",
   GET = "GET"
}

export interface RESTConfig {
   url: string;
   method: RESTMethod;
   data: any;
}

我想像这样在另一个类中导入和使用枚举:

import { RESTConfig, RESTMethod } from './RESTConfig';

class Pipelines {
   ...
   private someMethod() {
      let rest: RESTConfig = {
         url: "",
         method: RESTMethod.POST,
         data: {}
      }
      ...

   }
   ...
}

linting 和 transpiling 工作正常,但在运行时出现以下错误:

TypeError: 无法读取未定义的属性“POST”

在“方法:RESTMethod.POST”行上。

谁能告诉我我做错了什么?

【问题讨论】:

  • 找到答案了吗?
  • 使枚举​​不恒定 - 删除 'const' 术语

标签: typescript enums undefined


【解决方案1】:

我刚刚发现,如果您有循环导入,也会发生这种情况。

【讨论】:

  • 这就是我的问题
  • 看来这并不难发生!
  • 这应该会进一步上升
  • 我相信这是TypeScript/issues/3200
  • 你救了我的命
【解决方案2】:

在 Typescript 中有 2 种枚举:

  • 经典enum:

在 TS 到 JS 的转换过程中,它们被转换为真实的对象,因此它们存在于运行时。

enum Response {
    No = 0,
    Yes = 1,
}

const yes = Response.Yes; // Works at runtime

const nameOfYes = Response[yes]; // Also works at runtime because a reverse mapping is also generated during transpilation
  • const enum(你正在使用的那个):

常量枚举在 JS 中的转译过程中被删除,因此您不能在运行时使用它们。根据TS doc const enums 的存在是为了避免在访问枚举值时支付额外生成的代码和额外间接的成本。

const enum Response {
    No = 0,
    Yes = 1,
}

const yes = Response.Yes; // At runtime: ReferenceError: Response is not defined

const nameOfYes = Response[yes]; // During transpilation: TS2476: A const enum member can only be accessed using a string literal.

因此,只需将您的 const enum 更改为 enum,您的运行时错误就会消失。

【讨论】:

  • 当你export declare enum时也会发生。
  • @MichałTatarynowicz 如果您需要export 您的枚举但还需要在运行时使用它,您如何解决此问题?
【解决方案3】:

试试这个

export enum RESTMethod {
   POST = "POST",
   GET = "GET"
}

import { RESTConfig, RESTMethod } from './RESTConfig';

class Pipelines {
   ...
   private someMethod() {
      let restMethodEnum = RESTMethod;
      let rest: RESTConfig = {
         url: "",
         method: restMethodEnum.POST,
         data: {}
      }
      ...

   }
   ...
}

【讨论】:

    【解决方案4】:

    将枚举放入独立文件时对我有用

    【讨论】:

    • 可能你有一个循环依赖
    【解决方案5】:

    如果您在运行测试时遇到此问题,请确保 enum 的文件包含在 tsconfig.spec.json 文件中。

    例如当枚举在types.ts 文件中时

    {
      [...]
      "include": ["types.ts"]
      [...]
    }
    

    【讨论】:

      【解决方案6】:

      如果您在 tsconfig.json 中有 --isolatedModules 或在 ts-loader 中有 transpileOnly,您可能会点击 this issue。基本上,你不能将这些东西与export const enum结合使用。

      用评论者的话来说:

      transpileOnly 表示一次转译每个文件。当编译器查看一个文件时,它无法知道它正在查看的引用是否是 const 枚举,因为声明在另一个它无权访问的文件..

      所以我认为您不能混合使用这两个概念,const enums(需要整个程序信息)和transpileOnly(一次一个文件)。

      【讨论】:

        【解决方案7】:

        如果你想识别你的循环依赖,运行 npx madge --circular --extensions ts ./

        (来源:Andrejs Abrickis 的博客https://andrejsabrickis.medium.com/locate-circular-dependencies-in-typescript-modules-2b1eb03dbf2e)

        【讨论】:

          猜你喜欢
          • 2020-01-24
          • 1970-01-01
          • 2021-10-18
          • 2017-04-30
          • 2017-07-21
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多