I have a React component that should only be displayed if the user are using the Electron browser. Hence, I want to have an early return in my React component so I don't execute a lot of logic if the user is not using the Electron browser. I have the following minimal example:
export const MyComponent = () => {
if (!isElectron) {
return <p>You need to use Electron</p>
}
useEffect(() => { // <-- gives error: React Hook "useEffect" is called conditionally. React Hooks must be called in the exact same order in every component render.
console.log("You are using Electron");
}, []);
return <p>You are using Electron</p>
}
The useEffect in the example above gives the error: React Hook "useEffect" is called conditionally. React Hooks must be called in the exact same order in every component render. I simply want to ignore the error message for the whole file, and preferably not ignore other errors. How do I ignore the error message for a whole file?
if (!isElectron)in the parent component which rendersMyComponent? You cannot call hooks conditionally.