How to Check Version of React Application

    Apr 28, 2020       by Suraj Roy

While working with any technology/framework, We get issue due to version compatibility. So a developer should be always ready to deal with such issues, For that the version of the app should be checked.

 

In this article, We will see how to check the version locally and globally of the React.js application.

Let's Get Started

1. Using package.json file

The easiest and shorted way to check the React.js app version is to check it inside the package.json file under the dependencies section. 

 

 
{
...
...
"dependencies": {
  "@testing-library/jest-dom": "^4.2.4",
  "@testing-library/react": "^9.5.0",
  "@testing-library/user-event": "^7.2.1",
  "axios": "^0.19.2",
  "react": "^16.13.1",
  "react-dom": "^16.13.1",
  "react-scripts": "3.4.1"
},
....
...
}
 

 

2. Using node_modules

This is also a very easy way, We can check the version by moving inside file node_modules/react/cjs/react.development.js.

 

 
/** @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.
*/
 

 

3. Check using the terminal command

Below command can be used to check the version:

npm view react version

 

4. Using Component

The version can also be checked very easily inside the React Component file. Look at the example below:

 

 
import React from 'react'
 
function App() {
return (
<div className="App">
React version is: <strong>{React.version}</strong>
</div>
);
}
 
export default App;
 

 

Check Local Packages Installed in React App

For checking, the version of packages inside the React.js application, Below command can be used

npm list --depth 0

 

List will show like below:

+-- @testing-library/jest-dom@4.2.4
+-- @testing-library/react@9.5.0
+-- @testing-library/user-event@7.2.1
+-- axios@0.19.2
+-- react@16.13.1
+-- react-dom@16.13.1
+-- react-scripts@3.4.1

 

Conclusion

In this article, We learn about the different ways to check the version of the installed packages.

I hope this article helped you. You can also find other demos of React.js Sample Projects here to start working on enterprise-level applications.

Let me know your thoughts over email at demo.jsonworld@gmail.com. I would love to hear them and If you like this article, share it with your friends.

Thank You!


WHAT'S NEW

Find other similar Articles here: