mixing .js/.jsx and .ts/.tsx about create-react-app-typescript HOT 4 CLOSED

Thank you @wmonk for the answer. In the meantime I managed to rename everything in my project to .ts / .tsx and types. Since my project was not to big yet that was doable.

As I understand it the option allowJs=true in tsconfig.json should theoretically allow to just "do a quick sanity check" on .js files and otherwise pass them through to the output folder to allow for a smooth transition. It didn't work for me though. But wouldn't that theoretically be an option for people wanting to add the benefits of typescript without the pain of having to rename / add types to everything in an existing project?

After all it is a great addition (imho) to have the types around. It already helped me catch and understand a couple of issues with my code.

Thanks again @wmonk for making using ts with react-scripts possible.

from create-react-app-typescript.

Hi @michabu, no problem 😄 !

You are correct, react-scripts-ts will not compile js or jsx files. You can see in this commit that babel-loader was removed from the webpack config. You are still able to require js files, but they will not be run through babel. I suppose the reason for this is to keep the package as slim as possible, if you're writing typescript, it's unlikely you need the babel transpiler as well. I think CRA promotes starting new projects, rather than retrofitting into old projects.

If you want to add back in the babel loader, you can run npm run eject, and then update the webpack config yourself. Be warned, this is a permanent action! However, you could do something clever with git, wherein you eject, update the config, and commit in one go. Then to use react-scripts-ts again in the future, you could revert that commit. I've not tried this myself, and is only a thought, so take it with a pinch of salt 😄

from create-react-app-typescript.

@michabu, glad you got it sorted! Not sure about getting it to work incrementally, I suppose updating the webpack config should be enough though.

from create-react-app-typescript.

@wmonk sorry for commenting on an old bug, but i didnt want to create a new one. we are looking at migrating a big jsx project to tsx as well. and we would love to use your infrastructure. is it not possible to have babel as an optional dependency (or some other way to run jsx ) ?

having a large single cutover is going to be extremely hard for a lot of projects like us.

from create-react-app-typescript.