x-for doesn't work with TypeScript

[Ni55aN]

As I understand, a TypeScript transformer is needed to solve this problem. Are you planning to create it in the future?

Application created with create-react-app --typescript

Config extended with react-app-rewired

const {
    override,
    disableEsLint,
    useBabelRc
  } = require('customize-cra')
  
  module.exports = override(
    disableEsLint(),
    useBabelRc()
  )

.babelrc

{
    "plugins": [
      "react-directives",
      "@babel/transform-react-jsx"
    ]
}

[peakchen90]

@Ni55aN I have reproduced this problem and will try to solve it. It may take some time.

[peakchen90]

@Ni55aN
I may not be able to do anything for the typescript transformer, and not consider the syntax of typescript at the beginning of development. And for this case, you can declare item before used, like this:

declare let item: any;

It is not recommended to use x-for in typescript now.

There is a difference between Javascript and Typescript in the AST tree. For better support, it may be rewritten for Typescript in the future.

[martinszeltins]

Has this issue been fixed? Since Typescript is so popular now, it'd be nice if this worked.

[peakchen90]

@martinszeltins Haven't found a proper way to fix it yet, it is recommended not to use x-for in typescript