skip to Main Content

I am using XState on the backend and per the XState docs, I added type annotation to my state machine’s config:

export const machine = createMachine(
    {
      tsTypes: {} as import("./testMachine.server.typegen").Typegen0,
    ...,
    }

However, the type cast is throwing this error:

`import()` type annotations are forbidden.eslint@typescript-eslint/consistent-type-imports
interface Typegen0

I looked into dynamic imports, but that doesn’t seem to fix the issue:

const dynamicImport = async() => await import("./testMachine.server.typegen")

This is from my eslint.

2

Answers


  1. It says you MUST import types as

    import type { Typegen0 } from "./testMachine.server.typegen"
    export const machine = createMachine(
        {
          tsTypes: {} as Typegen0,
        ...,
        }
    

    You can read more in the documentation: https://typescript-eslint.io/rules/consistent-type-imports/#prefer

    Login or Signup to reply.
  2. It seems like it is just a linting error. Your eslint config expects a certain way of importing types. I would assume the type inference and your code still works.

    You can disable the linting error by putting an ignore comment directly above the line with the error. I am not sure if I got the comment 100% right, but sth in that direction should disable the error.

    // eslint-disable-next-line @typescript-eslint/consistent-type-imports
    // @ts-ignore
    

    Otherwise, you can also use the import syntax of this answer or adjust your eslint config accordingly.

    Btw, I assume await is never needed for importing types.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search