How To Install React 19 With Vite

With the stable release of React 19, developers are ready to try new features and improvements. However, the popular build tool for modern JavaScript frameworks, Vite, does not yet support an automatic installation method for React 19. Let's learn the process of manually setting up React 19 in a Vite project. This method will be valid until Vite provides support for React 19 by default.

Step 1: Ensure You Have Node.js Version 20 or Above

Before you get started, please make sure your version of Node.js is at least 20. The tooling features in React 19 require a more recent version of Node.js than this. To find the version of Node.js, run:

node -v

If your version is less than 20, then you have to update. You can download the latest version of Node.js from the official Node.js website or if you are using NVM you got your back covered.

Step 2: Create a Vite Project

To create a new Vite project, run the following command:

npm create vite@latest project-name

This will ask you to select a framework for your project. Choose React from the list and then TypeScript or JavaScript, whichever you prefer. Once Vite has finished setting up your project, it will install the following dependencies by default (see in package.json):

"dependencies": {
  "react": "^18.3.1",
  "react-dom": "^18.3.1"
}

Step 3: Upgrade to React 19

At this point, Vite has installed React 18 by default. To update to React 19, you have to do this manually. Update the dependencies by running the following commands to install React 19 and React-DOM 19:

npm install react@latest
npm install react-dom@latest

These commands will install the latest stable versions of React and React-DOM, which will be React 19 once you run them.

Step 4: Update TypeScript Types (If Using TypeScript)

If you're working with TypeScript, you must also upgrade the type definitions to ensure compatibility with React 19. Run the following command to install the appropriate types for React 19:

npm install --save-exact @types/react@^19.0.0 @types/react-dom@^19.0.0

This will install the correct type definitions for React 19 and React-DOM 19.

Step 5: Run Your Project

Once the installations are complete, run the following command to start the development server:

npm run dev

This will launch the Vite development server, and your project will now start using React 19. You may now begin writing code in the latest version of React and take advantage of the new features in it.