skip to Main Content

I am trying to configure React to default to .tsx instead of .jsx for project files.

If possible, everytime npx create-react-app is run, the project would be setup using .tsx files.

Is there anyway to do this in the React project configurator, or must this be done independently for each individual React project created?

I looked into the React docs, however, the closest thing I found simply provides an explanation of how to configure a single React Project with TypeScript, not how to default React Project’s to TypeScript.

2

Answers


  1. You should use vite
    https://vitejs.dev/guide/

    For instance create a project with npm:
    npm create vite@latest

    Login or Signup to reply.
  2. Using create-react-app

    CRA has a template for typeScript. To use typeScript run the following command:

    npx create-react-app@latest --template typescript
    

    This will create 3 files:

    src
    |___ index.tsx
    |___ App.tsx
    tsconfig.json
    

    All these files carry the same meaning as their javaScript counter part just with typeScript!

    IMPORTANT: create-react-app is no longer listed as a recommended option in the React docs.

    Using create-vite a better alternative

    Vite is a faster, drop in replacement for CRA. To create a Vite app simply run:

    npm create vite@latest -- --template react-swc-ts
    

    This will create a similar setup but without some of the drawbacks of CRA.

    For a full comparison see create-react-app vs Vite

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