Can't load JS static file, but style.css file still work

Question

This is my error. The styles.css and index.js file in same folder name network. But the styles.css file is work, and index.js file doesn't work, it looking to my other project is Mail

[20/Feb/2022 14:17:59] "GET / HTTP/1.1" 200 1804
[20/Feb/2022 14:17:59] "GET /static/network/styles.css HTTP/1.1" 304 0
[20/Feb/2022 14:18:01] "GET /static/mail/inbox.js HTTP/1.1" 404 1667
[20/Feb/2022 14:18:01] "GET / HTTP/1.1" 200 1804

setting.py

STATIC_URL = '/static/'

index.html

{% extends "network/layout.html" %}
{% load static %}

{% block body %}
{% endblock %}

{% block script %}
    <script src="{% static 'network/index.js' %}" defer></script>
{% endblock %}

index.js

console.log('OK');

layout.html

{% load static %}

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>{% block title %}Social Network{% endblock %}</title>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
        <link href="{% static 'network/styles.css' %}" rel="stylesheet">
    </head>
    <body>
        <div class="body">
            {% block body %}
            {% endblock %}
        </div>
    </body>
</html>

Have you tried specifying the STATICFILES_DIRS in settings.py? — vishu
– vishu, Commented Feb 20, 2022 at 8:20
Try adding this in your settings.py: STATICFILES_DIRS = [os.path.join(BASE_DIR, "static")] also import os if not there. — vishu
– vishu, Commented Feb 20, 2022 at 8:24
@eisanahardani network/templates/network/layout.html. I just update layout.html file above, pls check, thank you !!! — Kev
– Kev, Commented Feb 20, 2022 at 12:01

eisa nahardani · Accepted Answer · 2022-02-20 13:11:58Z

1

You should add block script in layout.html

{% load static %}

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>{% block title %}Social Network{% endblock %}</title>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
        <link href="{% static 'network/styles.css' %}" rel="stylesheet">
    </head>
    <body>
        <div class="body">
            {% block body %}
            {% endblock %}
        </div>

      {% block script %}
      {% endblock %}

    </body>
</html>

answered Feb 20, 2022 at 13:11

eisa nahardani

4014 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Kev Over a year ago

and you know why it sill get /static/mail/inbox.js ?. This is from my another project "Mail" ! code [21/Feb/2022 09:27:52] "GET /static/mail/inbox.js HTTP/1.1" 404 1667

eisa nahardani Over a year ago

Sorry, i need more information including file tree. do you use include tag in your network application in order to including mail template?

hossein vatankhah · Accepted Answer · 2022-02-20 08:11:04Z

0

add type to script and try it:

<script type="text/javascript" src="{% static "network/index.js" %}"></script>

answered Feb 20, 2022 at 8:11

hossein vatankhah

2142 silver badges9 bronze badges

1 Comment

Kev Over a year ago

nothing happen !

Collectives™ on Stack Overflow

Can't load JS static file, but style.css file still work

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related