0

I created a web app in React and now i'm trying to deploy it on a host. I ran npm run build from the command line. I copied files from the 'build' folder that is created and uploaded them in my host's folder (public_html/app).

but I only see a white screen in my mydomain.com/app or mydomain.com/app/index.html

enter image description here

Ok, now is working... after create a .htaccess file and also add the 'homepage' value in the package.json file.

But I can't see my jsx components. I only see the app.js contents

My index.js looks like this:

import { createRoot } from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';


const container = document.getElementById('root');
const root = createRoot(container);
root.render(<App tab="home" />);

reportWebVitals();

app.js

  return (
    <div className="app-container">
      <header className="app-header">
        <img src={logo} className="logo-header" alt='logo' />
        <Router>
            <Routes>
              <Route index element={<Register />} />
              <Route path="/Login" caseSensitive={false} element={<Login />} />
              <Route path="/Register" caseSensitive={false} element={<Register />} />
              <Route path='/Profile' caseSensitive={false} element={<Profile />} />
              <Route path='/Formrdo' caseSensitive={false} element={<Formrdo />} />
              <Route path='/Setup' caseSensitive={false} element={<Setup />} />
              <Route path='/ResetPassword' caseSensitive={false} element={<ResetPassword />} />
            </Routes>
        </Router>
      </header>

package.json

enter image description here

.htaccess

<IfModule mod_rewrite.c>

  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-l
  RewriteRule . /index.html [L]

</IfModule>```
Adele
  • 259
  • 1
  • 4
  • 11
  • Consult browser's console to see what errors you get – Wiktor Zychla Jun 11 '22 at 15:23
  • I get: Failed to load resource: the server responded with a status of 404 () 4 times – Adele Jun 11 '22 at 15:25
  • Does this answer your question? [Failed to load resource: the server responded with a status of 404 (Not Found) in React.js Project deployed](https://stackoverflow.com/questions/60271280/failed-to-load-resource-the-server-responded-with-a-status-of-404-not-found-i) – palindrom Jun 11 '22 at 16:42
  • Yes I fixed that part and now i can see the app but i can't see all my components (jsx) @palindrom – Adele Jun 11 '22 at 16:46
  • if you are using create-react-app , – Aakash Rathee Jun 11 '22 at 17:16
  • please provide your project configuration in your question – simo54 Jun 12 '22 at 07:43
  • You have to change base url from index.html Ref: https://stackoverflow.com/questions/45208595/setting-base-href-using-environment-variables – Harikrushna Patel Jun 12 '22 at 07:43
  • @simo54 what configuration? – Adele Jun 12 '22 at 08:45
  • @AakashRathee yes, I'm using create-react-app and I followed the docs. But i can't fix that... – Adele Jun 12 '22 at 08:47
  • my bad. I meant previously to share your files configuration such as package.json, webpack file if there is any, etc etc. There are many missing informations in your question that prevent the viewers to see what's causing the issue. – simo54 Jun 12 '22 at 09:16

0 Answers0