Django-无法加载静态文件?

时间:2019-02-23 14:00:28

标签: django

对于Django来说,这是我的新手,我正尝试在YouTube上遵循senddex的教程。

  

Django 1.9版

选择本教程中使用的版本。

我似乎无法弄清楚如何加载css文件。

css文件的位置

/media/xxx/django tutorial/mysite/personal/static/personal/css

我假设BASE_URL一直引用到: /media/xxx/djangotutroial/mysite

这是manage.py的位置。还是我错了?

css中引用了header.html文件:

 {% load staticfiles %}
 <link rel="stylesheet" href="{% static 'personal/css/bootstrap.min.css' %}" type = "text/css"/>

我阅读了很多答案,如果我理解正确,则必须在settings.py文件夹中更改mysite

这是我目前所拥有的:

STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR,'personal'),
]

我在os.path.join中尝试了很多组合,但仍然无法加载文件。

感谢您的帮助。

项目结构:

django tutorial
--mysite
  --mysite
    ---------__pycache_
    ---------__init__.py
    ---------settings.py
    ---------urls.py
    ---------wsgi.py
  --personal
    ---------migrations
    ---------__pycache_
    ---------static
             ------personal
                   ------css     # has the bootstrap.min.css
                   ------js
    ---------templates
    ---------admin.py
    ---------apps.py
    ---------init.py
    ---------models.py
    ---------tests.py
    ---------urls.py
    ---------views.py

如果有人可以告诉我正确的命令来获取ubuntu中的目录结构,我很乐意在此处显示。

模板:

在home.html中:

{% extends "personal/header.html" %}


{% block content %}


<p>Hey, welcome to my webpage. We are testing.<p>


{% include "personal/includes/htmlsnippets.html" %}

{% endblock %}

查看页面源中的错误消息

<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Page not found at /static/personal/css/bootstrap.min.css</title>
  <meta name="robots" content="NONE,NOARCHIVE">
  <style type="text/css">
    html * { padding:0; margin:0; }
    body * { padding:10px 20px; }
    body * * { padding:0; }
    body { font:small sans-serif; background:#eee; }
    body>div { border-bottom:1px solid #ddd; }
    h1 { font-weight:normal; margin-bottom:.4em; }
    h1 span { font-size:60%; color:#666; font-weight:normal; }
    table { border:none; border-collapse: collapse; width:100%; }
    td, th { vertical-align:top; padding:2px 3px; }
    th { width:12em; text-align:right; color:#666; padding-right:.5em; }
    #info { background:#f6f6f6; }
    #info ol { margin: 0.5em 4em; }
    #info ol li { font-family: monospace; }
    #summary { background: #ffc; }
    #explanation { background:#eee; border-bottom: 0px none; }
  </style>
</head>
<body>
  <div id="summary">
    <h1>Page not found <span>(404)</span></h1>
    <table class="meta">
      <tr>
        <th>Request Method:</th>
        <td>GET</td>
      </tr>
      <tr>
        <th>Request URL:</th>
        <td>http://127.0.0.1:8000/static/personal/css/bootstrap.min.css</td>
      </tr>

    </table>
  </div>
  <div id="info">

      <p>&#39;personal/css/bootstrap.min.css&#39; could not be found</p>

  </div>

  <div id="explanation">
    <p>
      You're seeing this error because you have <code>DEBUG = True</code> in
      your Django settings file. Change that to <code>False</code>, and     Django
      will display a standard 404 page.
    </p>
  </div>
</body>
</html>

在运行服务器的终端:

[24/Feb/2019 06:19:32] "GET /static/personal/css/bootstrap.min.css HTTP/1.1" 404 1703

使用@bkawan代码运行时出错:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Page not found at /static/personal/css/bootstrap.min.css</title>
  <meta name="robots" content="NONE,NOARCHIVE">
  <style type="text/css">
    html * { padding:0; margin:0; }
    body * { padding:10px 20px; }
    body * * { padding:0; }
    body { font:small sans-serif; background:#eee; }
    body>div { border-bottom:1px solid #ddd; }
    h1 { font-weight:normal; margin-bottom:.4em; }
    h1 span { font-size:60%; color:#666; font-weight:normal; }
    table { border:none; border-collapse: collapse; width:100%; }
    td, th { vertical-align:top; padding:2px 3px; }
    th { width:12em; text-align:right; color:#666; padding-    right:.5em; }
    #info { background:#f6f6f6; }
    #info ol { margin: 0.5em 4em; }
    #info ol li { font-family: monospace; }
    #summary { background: #ffc; }
    #explanation { background:#eee; border-bottom: 0px none; }
  </style>
</head>
<body>
  <div id="summary">
    <h1>Page not found <span>(404)</span></h1>
    <table class="meta">
      <tr>
        <th>Request Method:</th>
        <td>GET</td>
      </tr>
      <tr>
        <th>Request URL:</th>
           <td>http://127.0.0.1:8000/static/personal/css/bootstrap.min.css</td>
      </tr>

    </table>
  </div>
 <div id="info">

      <p>&#39;personal/css/bootstrap.min.css&#39; could not be found</p>

  </div>

  <div id="explanation">
    <p>
      You're seeing this error because you have <code>DEBUG = True</code> in
      your Django settings file. Change that to <code>False</code>,     and Django
          will display a standard 404 page.
        </p>
      </div>
    </body>
    </html>

4 个答案:

答案 0 :(得分:2)

您应该在开发期间为他们提供服务。选中此part。 编辑主urls.py(您将在与settings.py的文件夹中找到它)。

from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    # ... the rest of your URLconf goes here ...
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

确保您的应用在Django设置的INSTALLED_APPS中列出。

答案 1 :(得分:2)

请检查您是否已完成以下第一步

Django 1.9 link的官方文档链接

  

此文档适用于不再安全的Django版本   支持的。请升级到较新的版本!

请尝试继续使用新版本,因为不再支持文档1.9。

配置静态文件

  1. 确保django.contrib.staticfiles已包含在INSTALLED_APPS中。

检查您的文件夹结构是否与以下类似

Project Structure image Link

除非个人文件夹与BASE_DIR处于同一级别,否则您无需在下面添加代码

os.path.join(BASE_DIR,'personal')

如果您有个人应用程序,然后在个人应用程序中包含静态文件夹,然后在静态文件夹中包含个人文件夹,即个人/静态/个人,则下面的代码就可以了

 {% load staticfiles %}
 <link rel="stylesheet" href="{% static 'personal/css/bootstrap.min.css' %}" type = "text/css"/>

如果找不到页面错误。

检查bootstrap.min.css是否存在于个人/css/bootstrap.min.css路径中  还要选中拼写

检查您的应用,例如,在这种情况下,个人应用包含在INSTALLED_APPS中

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'personal'
]

答案 2 :(得分:0)

从样式表导入中删除 / personal 。相反,只需:

{%load static%}
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}" type = "text/css"/>

答案 3 :(得分:0)

我不确定您是否复制并粘贴了完全相同的代码,但是p结束标记在home.html中没有语法。