Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Friction in TypeScript setup experience #6119

Closed
DanielRosenwasser opened this issue Jan 3, 2019 · 9 comments
Closed

Friction in TypeScript setup experience #6119

DanielRosenwasser opened this issue Jan 3, 2019 · 9 comments
Labels

Comments

@DanielRosenwasser
Copy link

@DanielRosenwasser DanielRosenwasser commented Jan 3, 2019

In trying to update the TypeScript React Starter, I'm trying to leverage the newly supported support in CRA; however, running create-react-app with the --typescript flag seems to not do anything, and the process of adding TypeScript in general has a bit of friction.

As an example, I ran

npx create-react-app myapp --typescript

I expected at least the following:

  1. My files should have been .ts/.tsx files.
  2. A prescriptive tsconfig.json file should have been given to me out of the box.
  3. My devDependencies should have included typescript, @types/react, and @types/react-dom.

Instead,

  1. The --typescript flag didn't do anything special, and I had to rename a file like App.js to App.tsx before yarn start gave me a tsconfig.json.
  2. yarn start told to run yarn add typescript after the rename (which is misleading since it should be a devDependency - so yarn add -D typescript).
  3. Running yarn start one more time, I was given a type-error because I was missing @types/react and @types/react-dom as devDependencies.

Then everything worked, but this feels extremely frictiony. And it's also fairly confusing, because this flag doesn't seem to give anything beyond what the standard CRA scaffolding gives. And other issues have pointed this out too:

@iansu
Copy link
Collaborator

@iansu iansu commented Jan 4, 2019

The issue is #5939 was that npx was using an old, cached version of Create React App. Perhaps the case for you too?

@Timer
Copy link
Contributor

@Timer Timer commented Jan 4, 2019

I'm guessing we should file a bug with npx or find an alternative way of creating apps, does "npm init react-app" behave differently?

@iansu
Copy link
Collaborator

@iansu iansu commented Jan 4, 2019

npm init appears to use npx under the hood so I imagine the behaviour would be the same: https://docs.npmjs.com/cli/init#description

I agree though, this has happened a few times so it's probably worth mentioning it to npm.

@mrmckeb
Copy link
Collaborator

@mrmckeb mrmckeb commented Jan 4, 2019

@DanielRosenwasser I can confirm that I'm not hitting this issue on my machine either, I don't have a global install of create-react-app.

Could you confirm if you do?

Also, have you tried running yarn create react-app --typescript? Does that perform the same way?

@mccombsr
Copy link

@mccombsr mccombsr commented Jan 5, 2019

I am running into the same issue right now trying to create my first typescript react app using npx create-react-app myapp --typescript. I have create-react-app installed globally.

@ianschmitz
Copy link
Contributor

@ianschmitz ianschmitz commented Jan 5, 2019

If you're using npx, make sure you don't have create-react-app installed globally, as it will used the installed version i believe.

npm uninstall -g create-react-app

@mccombsr
Copy link

@mccombsr mccombsr commented Jan 5, 2019

@ianschmitz You were right, I globally uninstalled create-react-app (and typescript just to be safe) and it worked this time around! Thanks for the help!

@stale
Copy link

@stale stale bot commented Feb 7, 2019

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

@stale stale bot added the stale label Feb 7, 2019
TaylorBriggs added a commit to TaylorBriggs/create-react-app that referenced this issue Feb 9, 2019
It is necessary to uninstall any version that was previously installed for the typescript flag to work when using npx.
@stale
Copy link

@stale stale bot commented Feb 12, 2019

This issue has been automatically closed because it has not had any recent activity. If you have a question or comment, please open a new issue.

@stale stale bot closed this as completed Feb 12, 2019
@lock lock bot locked and limited conversation to collaborators Feb 17, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

No branches or pull requests

6 participants