Download as pdf or txt
Download as pdf or txt
You are on page 1of 4

About Contact

ANGULAR 16 VUE REACT IONIC 7 FIREBASE LARAVEL 10 CODEIGNITER PHP

Home » React » How to Check React App Version Quickly?

How to Check React App Version


Quickly?
Last Updated: October 10, 2023 by Digamber

In this quick tutorial, we will learn how to check the React App
version locally and globally.

There are various methods available to check the installed version of


React app. And, we are going to have a look on those methods one
by one in this tutorial.

We can verify the React version by directly visiting the package.json

file and see the React app version at dependencies: {} section as


given below.

This site uses cookies. By continuing to browse the site you are agreeing to
our use {of cookies. Read more
OK
...
...
...
"name": "react-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1"
},
...
...
...
}
The other method is also straightforward, you can check the React
app version by heading over to
node_modules/react/cjs/react.development.js.

You can see the react project version in the commented section as
showing given below.

/** @license React v16.13.1


* react.development.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

How to Display React Version?


You can also directly the React version by using the below technique.
We will add the following code in the React component and show
the version of React via the web browser.

Open the src/App.js file and replace with the following code.

import React from 'react'


function App() {
return (
<div className="App">
Here is the Latest React version: <strong>{React.version}</strong>
</div>
);
}
export default App;

Run the following command to view the React version.

npm start

Find React Version via Command


Moreover, we can find out the React and React Native version via
command line tool. We just have to run the following commands to
get the version details.
npm view react version
# 16.13.1

To get the React Native version use the below command.

npm view react-native version


# 0.62.0

Check Installed React Native Globally


Use the command to find out which react-native version is installed
in your local development system.

npm ls react-native -g

It will display similar type of result on your terminal screen.

/usr/local/lib
└── react-native@0.61.5

Check Local Packages Installed in React App


Sometimes, we need to check out what all packages are installed in a
React app. Don’t worry, and it can quickly be done using a just simple
command from your app’s root folder.

npm list --depth 0

It will display the following result:

# react-app@0.1.0 /Users/user/Desktop/react-app
# ├── @testing-library/jest-dom@4.2.4
# ├── @testing-library/react@9.5.0
# ├── @testing-library/user-event@7.2.1
# ├── react@16.13.1
# ├── react-dom@16.13.1
# └── react-scripts@3.4.1

Digamber
A Full-stack developer with a passion to solve real
world problems through functional programming.

Twitter GitHub

Recommended Posts

• React 18 Dropdown Select Tutorial with React-select

• React 18 Canvas Join Two Rectangles with Line Tutorial

• How to Disable Past, Weekdays Dates in React 18 Date Picker

• How to Create Draggable Canvas Element in React 18

• How to Create Rounded Rectangle on Canvas with React 18

• React 18 Draw Line Shape on Canvas Surface Tutorial


• How to Draw Rectangle on HTML5 Canvas using React 18

• React 18 Animate Marker on Google Route Map Tutorial

• How to Write or Add a Text in HTML5 Canvas in React 18

• How to Build Range 18 Area Chart in React using Apexcharts

• How to Implement Preset in React 18 Date Range Picker

• How to Build Google Street View Map in React 18

HTML 5, CSS 3, JavaScript, PHP, React, Angular, Laravel — Explore Categories


Aimed to offer custom coding solutions on almost every
modern programming language. About Angular

Affiliate Disclosure Vue

Privacy Policy React

Disclaimer Ionic

Contact Laravel

Codeigniter

PHP

© 2016-2023 All Rights Reserved - www.positronx.io

You might also like