1

I am currently learning React.js and started to combine it with Django.

I tried to build a simple homepage that will display Hello, World!

import logo from './logo.svg';
import './App.css';
import React from 'react';
import ReactDOM from 'react-dom';

class App extends React.Component{
  render(){
    return (
      <h1>Hello, World!</h1>
    )
  }
}

export default App;

It works fine on the browser, but when I check the console, there is an error GET http://localhost:8000/manifest.json 404 (Not Found). What is this manifest.json file that I am missing?

This is how I set up my Django project settings:

STATICFILES_DIRS = [os.path.join(BASE_DIR, 'frontend/build/static')]

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'frontend/build')],
            ...
            ...
            ],
        },
    },
]

My project tree looks like this:

Enter image description here

And the error looks like this:

Enter image description here

What can I do with this error?

Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
newbie programmer
  • 307
  • 3
  • 13
  • In your static directory I see manifest.json file. What is it that you are doing with it ? – rootkonda Mar 22 '21 at 05:20
  • It is already there when I created my react app. I didnt put it there. And I didnt do or write anything in there. I just followed react documentations on how to start a react app. @rootkonda – newbie programmer Mar 22 '21 at 05:23
  • https://stackoverflow.com/questions/58253325/my-link-to-manifest-json-in-index-html-works-when-i-run-react-script-yarn-start – rootkonda Mar 22 '21 at 05:28
  • I tried removing link to manifest.js in index.html and tried to run python manage.py runserver and looked at the console, the error isnt there. however, in order to see changes you made on react app, I need to run ```npm run build``` on cmd and it recreates the manifest.json file. Should I leave it be? – newbie programmer Mar 22 '21 at 05:41

2 Answers2

1

You have to open the package.json file in the main folder of your React project and write the next line {--> "homepage": "./", <--} without the "{" and arrows. This worked for me in XAMPP localhost.

Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
Lautaro Zanuttini
  • 21
  • 2
0

You need to add:

path('manifest.json', TemplateView.as_view(template_name='manifest.json', content_type='application/json'), name='manifest.json')

in your urls.py file

urls.py

Harsh Mangalam
  • 1,116
  • 1
  • 10
  • 19
Bruno Gomes
  • 1
  • 1