开发者问题收集

Django 静态文件不显示

2021-03-01
1198

我的项目名称 resume

我想将 bootstrap 添加到我的项目中

首先我将资产文件复制到名为 resume 的项目子文件夹中 =>静态 assests 文件

    - resume->resume/static
然后我在设置 .py
STATIC_DIR = BASE_DIR / 'resume/static'

STATIC_ROOT = BASE_DIR / 'static'
STATIC_URL = '/static/'
STATICFILES_DIRS = [
    STATIC_DIR,
]
中添加以下设置>

之后我尝试了 python manage.py collectstatic

并得到了一个新目录

新的静态目录

之后我尝试添加标签 {% load static %} 并将路径更改为 {% static 'path' %>


<!DOCTYPE html>
{% load static %}
<html lang="en">

<head>

  <meta charset="utf-8">
  <meta content="width=device-width, initial-scale=1.0" name="viewport">

  <title>MyResume Bootstrap Template - Index</title>
  <meta content="" name="description">
  <meta content="" name="keywords">

  <!-- Favicons -->
  <link href="{% static 'img/favicon.png' %}" rel="icon">
  <link href="{% static 'img/apple-touch-icon.png' %}" rel="apple-touch-icon">

  <!-- Google Fonts -->
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">

  <!-- Vendor CSS Files -->
  <link href="{% static 'vendor/aos/aos.css' %}" rel="stylesheet">
  <link href="{% static 'vendor/bootstrap/css/bootstrap.min.css' %}" rel="stylesheet">
  <link href="{% static 'vendor/bootstrap-icons/bootstrap-icons.css' %}" rel="stylesheet">
  <link href="{% static 'vendor/boxicons/css/boxicons.min.css' %}" rel="stylesheet">
  <link href="{% static 'vendor/glightbox/css/glightbox.min.css' %}" rel="stylesheet">
  <link href="{% static 'vendor/swiper/swiper-bundle.min.css' %}" rel="stylesheet">

  <!-- Template Main CSS File -->
  <link href="{% static 'css/style.css' %}" rel="stylesheet">

indext.html

我的网站仍然没有显示

网站图片

请帮忙

浏览器控制台错误

ma​​in.js:2 未捕获的 TypeError:无法将属性“innerHTML”设置为 null at main.js:2 DevTools 无法加载 SourceMap:无法加载 http://127.0.0.1:8000/static/vendor/swiper/swiper-bundle.min.js.map 的内容:HTTP 错误:状态代码404,网络::ERR_HTTP_RESPONSE_CODE_FAILURE

2个回答

您必须将 {% load static %} 放在第一行。

Henrik
2021-03-01

好的问题是Chrome浏览器。 代码没有错误。
当我使用Mozilla Firefox打开服务器时,没有错误,网站运行正常

问题是Chrom DevTool设置。

Ali Umer
2021-03-11