Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

520
Visualizações
Blank White page React.js

I am currently using a create reactjs app with localhost:3000 as the server. I have added a Header.js page and linked it to my App.js but a blank white page keeps showing up when I run my deployment server. The program is reading my index.js file linked to my app.js because a serviceworker.js syntax shows up as it couldn't compile, but it still leaves a white page. Below is my code.

App.Js:

import React from 'react';
import Header from './Header';
import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
import './App.css';

function App() {
  return (
    <div className="App">
     <h1>This is a tinder clone</h1>

     {/* Header */}
     <Header />
     {/* Tinder Cards */ }
    {/* Buttons below tinder card */}

    {/* Chats screen */}
    {/* Indvidual chat screen */}

    </div>
  );
}

export default App;

Index.js:

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(<App/>, document.getElementById('root'));


serviceWorker.unregister();

Header.js

import React from 'react';
import './Header.css';
import PersonIcon from '@mui/icons-material/Person';
import QuestionAnswerIcon from '@mui/icons-material/QuestionAnswer';

function Header() {
    return (
        // BEM 
        <div className="header">
        <PersonIcon />
        <img src="./images/Ringheart.png" alt="Heart logo"/>
         <QuestionAnswerIcon />
        </div>
    );
}

export default Header; 

The error I keep getting in my console is:

ERROR in ./src/index.js 8:0-49
Module not found: Error: Can't resolve './serviceWorker' in 'C:\Users\donal\Videos\Web-Developement\tinder-clone\src'
resolve './serviceWorker' in 'C:\Users\donal\Videos\Web-Developement\tinder-clone\src'
  using description file: C:\Users\donal\Videos\Web-Developement\tinder-clone\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: C:\Users\donal\Videos\Web-Developement\tinder-clone\package.json (relative path: ./src/serviceWorker)

I have also a "main": "src/app.js"in my package.json

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda