CODEWITHSUNDEEP
javascriptpythoncssreactjsdjango
Maksym Andreiev
Maksym Andreiev

Reputation: 57

DJango React Not found

I am new to DJango and React. I created a DJango project in Pycharm and then a React app using npm create-react-app frontend. I added to folder "src" some JavaScript file and edited a created automaticly index.css. I built React app and then launched DJango server. Console printed:

Not Found: /src/index.css
Not Found: /src/seigaiha.js
[25/Dec/2020 14:23:31] "GET /src/index.css HTTP/1.1" 404 2201
[25/Dec/2020 14:23:31] "GET /src/seigaiha.js HTTP/1.1" 404 2207

But .css fle is visibale on launched site. .js isn't.

Order in folder:

- frontend/
- - build/
- - - static/
- - - - css/ #here .css file after build has the same structure as index.css, so it buil
- - - - js/
- - - - media/
- - node-modules/
- - public/
- - src/
- - - index.css
- - - seigaiha.js

In settings.py:

'DIRS': [
            os.path.join(BASE_DIR / 'frontend/build')
        ]

In public/index.html:

***some code***
<link rel="stylesheet" type="text/css" href="./src/index.css">
***some code***
<div class="pattern">
    <canvas id="canvas">Canvas not supported.</canvas>
    <script src="src/seigaiha.js"></script>
</div>
***some code***

What I am doing wrong? Maybe I need to place this files in another folder? Or maybe a path is wrong? .js file name? When I have just .html, .css and js files (not in react) everything is ok.

UPD: I read some advices in stackoverflow and used npm start command instesd of npm run build. It didn't work.

Upvotes: 1

Views: 686

Answers (1)

Murilo Sitonio
Murilo Sitonio

Reputation: 307

Try something like this:

FRONTEND_DIR = os.path.abspath(os.path.join(BASE_DIR, "..", "front-end"))

TEMPLATES = [
    {
        "BACKEND": "django.template.backends.django.DjangoTemplates",
        "DIRS": [os.path.join(FRONTEND_DIR, "build")],
        "APP_DIRS": True,
        "OPTIONS": {
            "context_processors": [
                "django.template.context_processors.debug",
                "django.template.context_processors.request",
                "django.contrib.auth.context_processors.auth",
                "django.contrib.messages.context_processors.messages",
            ],
        },
    },
]

STATICFILES_DIRS = (os.path.join(FRONTEND_DIR, "build", "static"),)

Upvotes: 1

Related Questions