css 和其他资产未为我的 django webapp 加载

Question

CSS、JS、字体、图像和其他资产未加载到我的 django 应用程序中 index.html。该应用程序的所有资产都存在于“templates/assets”下我的 django 项目中的应用程序应用程序中。我已经尝试了其他答案，这是我对这个问题的建议，但即使是那个解决方案也不适合我。

[04/May/2022 05:48:50] "GET /assets/js/glightbox.min.js HTTP/1.1" 404 2311
Not Found: /assets/js/count-up.min.js
[04/May/2022 05:48:50] "GET /assets/js/count-up.min.js HTTP/1.1" 404 2308
Not Found: /assets/js/main.js
[04/May/2022 05:48:50] "GET /assets/js/main.js HTTP/1.1" 404 2284

这是我的目录树结构：

Project Name : myproject
App name that serves index.html : app

├── app
│   ├── admin.py
│   ├── apps.py
│   ├── models.py
│   ├── templates
│   │   ├── 404.html
│   │   ├── assets
│   │   │   ├── css
│   │   │   │   ├── LineIcons.2.0.css
│   │   │   │   ├── animate.css
│   │   │   │   ├── bootstrap.min.css
│   │   │   │   ├── glightbox.min.css
│   │   │   │   ├── main.css
│   │   │   │   └── tiny-slider.css
│   │   │   ├── fonts
│   │   │   │   ├── LineIcons.eot
│   │   │   │   ├── LineIcons.svg
│   │   │   │   ├── LineIcons.ttf
│   │   │   │   ├── LineIcons.woff
│   │   │   │   └── LineIcons.woff2
│   │   │   ├── images
│   │   │   │   ├── favicon.svg
│   │   │   │   ├── hero
│   │   │   │   │   └── phone.png
│   │   │   │   └── logo
│   │   │   │       ├── logo.svg
│   │   │   │       └── white-logo.svg
│   │   │   ├── js
│   │   │   │   ├── bootstrap.min.js
│   │   │   │   ├── count-up.min.js
│   │   │   │   ├── glightbox.min.js
│   │   │   │   ├── main.js
│   │   │   │   ├── tiny-slider.js
│   │   │   │   └── wow.min.js
│   ├── tests.py
│   ├── urls.py
│   └── views.py
├── manage.py
└── myproject
    ├── asgi.py
    ├── settings.py
    ├── urls.py
    └── wsgi.py

settings.py

STATIC_ROOT = os.path.join(BASE_DIR, '/templates/assets')
STATIC_URL = 'static/'

我该如何解决这个问题？

index.html

<link rel="shortcut icon" type="image/x-icon" href="assets/images/favicon.svg" />

<!-- ========================= CSS here ========================= -->
<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="assets/css/LineIcons.2.0.css" />
<link rel="stylesheet" href="assets/css/animate.css" />
<link rel="stylesheet" href="assets/css/tiny-slider.css" />
<link rel="stylesheet" href="assets/css/glightbox.min.css" />
<link rel="stylesheet" href="assets/css/main.css" />

编辑： 正如评论中所问，在更改静态路径时我得到

[04/May/2022 06:33:36] "GET /static/css/bootstrap.min.css HTTP/1.1" 404 1929
[04/May/2022 06:33:36] "GET /static/css/animate.css HTTP/1.1" 404 1911
[04/May/2022 06:33:36] "GET /static/css/LineIcons.2.0.css HTTP/1.1" 404 1929
[04/May/2022 06:33:36] "GET /static/css/tiny-slider.css HTTP/1.1" 404 1923
[04/May/2022 06:33:36] "GET /static/css/main.css HTTP/1.1" 404 1902
[04/May/2022 06:33:36] "GET /static/css/glightbox.min.css HTTP/1.1" 404 1929

Answer 1

setting.py

STATICFILES_DIRS = [
BASE_DIR / "static",
'/var/www/static/',
]

将此代码添加到下面的 settings.py 文件中。添加后尝试使用 crt+shift+r 快捷方式刷新 paga。它遇到了同样的问题，我添加了上面的代码并用 shoutcut boom 刷新了页面。它对我有用

Answer 2

{% load static %}

<link rel="shortcut icon" type="image/x-icon" href="{% static 'assets/images/favicon.svg' %}" />

<!-- ========================= CSS here ========================= -->
<link rel="stylesheet" href="{% static 'assets/css/bootstrap.min.css' %}" />
<link rel="stylesheet" href="{% static 'assets/css/LineIcons.2.0.css' %}" />
<link rel="stylesheet" href="{% static 'assets/css/animate.css' %}" />
<link rel="stylesheet" href="{% static 'assets/css/tiny-slider.css' %}" />
<link rel="stylesheet" href="{% static 'assets/css/glightbox.min.css' %}" />
<link rel="stylesheet" href="{% static 'assets/css/main.css' %}" />

如果你想使用静态文件，写入“{% load static %}”和{% static 'path' %}

Answer 3

{% load static %} 查找 STATIC_ROOT 下的静态文件、每个应用程序中的静态文件夹以及我们在 setting.py.

中指定的 STATIC_FILESDIR

Django 约定规定静态文件夹中的每个应用程序都有一个单独的应用程序文件夹。这是为了防止当我们运行 STATIC_FILESDIR.

中存在的同名文件之间的 collectstatic 命令时可能发生的任何冲突

此外，STATIC_ROOT 是我们在 collectstatic 命令运行之后保存所有静态资产的路径。

所以我建议您在 STATIC_FILESDIR 中添加资产目录的路径，或者在每个应用程序中创建一个名为 static 的文件夹，并将所有静态资产移到那里，因为默认情况下 djnago 会查找静态文件在 STATICFILES_DIRS 中定义的所有位置以及 INSTALLED_APPS 设置指定的应用程序的 'static' 目录中。或者，如果您想按自己的方式行事，则必须在 STATICFILES_DIRS 中指定与您拥有的应用程序数量一样多的资产目录路径。

css 和其他资产未为我的 django webapp 加载

css and other assets not loading for my django webapp

django

django-templates

django-staticfiles