Navbar icons are not showing . I have installed both overlay-navbar and react-icons. Can you help me please ?

[alalUDDIN123]

Showing like this

[TOSEEB]

did you got solution for this

[rajgorhetal]

Update your header.js with below code. This will solve the problem

import React from 'react'; import { ReactNavbar } from 'overlay-navbar'; import { MdAccountCircle } from 'react-icons/md'; import { MdSearch } from 'react-icons/md'; import { MdAddShoppingCart } from 'react-icons/md'; import logo from '../../../images/logo.png';

const options = { burgerColorHover: '#eb4034', logo, logoWidth: '20vmax', navColor1: 'white', logoHoverSize: '10px', logoHoverColor: '#eb4034', link1Text: 'Home', link2Text: 'Products', link3Text: 'Contact Us', link4Text: 'About Us', link1Url: '/', link2Url: '/products', link3Url: '/contact', link4Url: '/about', link1Size: '1.3vmax', link1Color: 'rgba(35, 35, 35,0.8)', nav1justifyContent: 'flex-end', nav2justifyContent: 'flex-end', nav3justifyContent: 'flex-start', nav4justifyContent: 'flex-start', link1ColorHover: '#eb4034', link1Margin: '1vmax', profileIcon: true, profileIconColor: 'rgba(35, 35, 35,0.8)', profileIconUrl: '/login', ProfileIconElement: MdAccountCircle, searchIcon: true, searchIconColor: 'rgba(35, 35, 35,0.8)', SearchIconElement: MdSearch, cartIcon: true, cartIconColor: 'rgba(35, 35, 35,0.8)', CartIconElement: MdAddShoppingCart, profileIconColorHover: '#eb4034', searchIconColorHover: '#eb4034', cartIconColorHover: '#eb4034', cartIconMargin: '1vmax', };

const Header = () => { return <ReactNavbar {...options} />; };

export default Header;

[rajgorhetal]

Showing like this

Please check above comment

[HetMamtora]

I have just started with Front-End part of E-Commerce project and compilation is going 100% successful but Navbar is not visible on react page. It's completely a blank page. Someone please help me to resolve this issue.

Here are the snapshots of code.

Header.js

App.js

Index.js

Package.json

I've force installed some of the packages using --legacy-peer-deps because the project is old and some of the libraries are deprecated but still usable as per the info from stackoverflow.

[HetMamtora]

I have just started with Front-End part of E-Commerce project and compilation is going 100% successful but Navbar is not visible on react page. It's completely a blank page. Someone please help me to resolve this issue.

Here are the snapshots of code.

Header.js

App.js

Index.js

Package.json

I've force installed some of the packages using --legacy-peer-deps because the project is old and some of the libraries are deprecated but still usable as per the info from stackoverflow.

SOLVED ! I updated to new format of index.js I was using the older one.

index.js(UPDATED) import React from 'react'; import ReactDOM from 'react-dom/client'; import App from './App';

const root = ReactDOM.createRoot( document.getElementById('root') ); root.render(

)

[sk394]

This helps me: <ReactNavbar searchIcon = {true} SearchIconElement = {MdSearch} profileIcon = {true} ProfileIconElement = {MdAccountCircle} cartIcon = {true} CartIconElement = {MdShoppingCart} {...options} /> </div>