Does this work with React files?

[tilomitra]

Thanks a lot for creating this! I was testing out the codemod on my NodeJS files and it works great. However, it errors out when I try it on React components that have JSX. I get this error:

 ERR ./components/storefront/CalendarTimeButton.js Transformation error (Unexpected token, expected "," (26:23))
SyntaxError: Unexpected token, expected "," (26:23)
    at Object._raise (/Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/parser/error.js:134:45)
    at Object.raiseWithData (/Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/parser/error.js:129:17)
    at Object.raise (/Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/parser/error.js:78:17)
    at Object.unexpected (/Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/parser/util.js:179:16)
    at Object.expect (/Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/parser/util.js:144:28)
    at Object.tsParseDelimitedListWorker (/Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/plugins/typescript/index.js:385:16)
    at Object.tsParseDelimitedList (/Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/plugins/typescript/index.js:345:14)
    at Object.tsParseBracketedList (/Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/plugins/typescript/index.js:407:27)
    at Object.tsParseTypeParameters (/Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/plugins/typescript/index.js:508:26)
    at /Users/tilo/.npm/_npx/26609/lib/node_modules/moment-dayjs-codemod/node_modules/@babel/parser/src/plugins/typescript/index.js:2748:31

My component compiles fine, so I'm not sure where this syntax error is coming from. The stack trace seems to suggest its within the jscodeshift parser. Was wondering if you had experience with this and could point me in a direction. Thanks! 🙏

[rajasegar]

@tilomitra I haven't tested against with React projects, especially with JSX syntax, can you give me some examples so that I can add some tests and check.

[YPCrumble]

@rajasegar thanks for building this! I'm getting the same error - here's a very simple file that throws the error:

import ReactDOM from 'react-dom'
import App from './App'

ReactDOM.hydrate(
  <App />,
  document.getElementById('root')
)

I've tried various parsers like --parser=ts and --parser=babylon but the error still seems to be thrown.

Thanks for any ideas you might have!

[rajasegar]

@YPCrumble Give me some time, will get back to you, i need to check this with a React project, I guess it is something to do with parsing the JSX syntax

[YPCrumble]

@rajasegar I ended up using a combination of this library and https://github.com/yanaemon/moment-to-dayjs-codemod to get most of the job done. Neither was perfect but together they got most of the job done. Neither was able to fully deal with moment-timezone either.