Django не загружает CSS и JS файлы в браузер

Я работаю над своим первым приложением Django. Я создал HTML-файл шаблона, но не могу заставить CSS и JS файлы загружаться при просмотре на моем localhost. Я изучил официальную документацию Django, но не смог определить проблему. Я очистил кэш браузера, но это ничего не изменило.

Settings.py

{% load static %} (включается в верхней части скрипта)

STATIC_ROOT= os.path.join(BASE_DIR, 'static')
STATIC_URL = 'static/'
STATICFILES_DIR = [
    os.path.join(BASE_DIR, 'myproject/static')
]

templates/base.html - CSS

<link
      href="http://fonts.googleapis.com/css?family=Roboto:300,400,700"
      rel="stylesheet"
      type="text/css"
    />
    <link
      href="{% static '\fonts\font-awesome.css' %}"
      rel="stylesheet"
      type="text/css"
    />
    <link
      rel="stylesheet"
      href="{% static 'bootstrap/css/bootstrap.css' %}"
      type="text/css"
    />
    <link
      rel="stylesheet"
      href="{% static 'css/bootstrap-select.min.css' %}"
      type="text/css"
    />
    <link
      rel="stylesheet"
      href="{% static 'css/jquery.slider.min.css' %}"
      type="text/css"
    />
    <link rel="stylesheet" href="{% static 'css/owl.carousel.css' %}" />
    <link rel="stylesheet" href="{% static 'css/style.css' %}" />

templates/base.html - JS

<script
      type="text/javascript"
      src="{% static 'js/jquery-2.1.0.min.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="http://maps.google.com/maps/api/js?sensor=false"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/jquery-migrate-1.2.1.min.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'bootstrap/js/bootstrap.min.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/smoothscroll.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/markerwithlabel_packed.js' %}"
    ></script>
    <script type="text/javascript" src="{% static 'js/infobox.js' %}"></script>
    <script
      type="text/javascript"
      src="{% static 'js/owl.carousel.min.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/bootstrap-select.min.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/jquery.validate.min.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/jquery.placeholder.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/icheck.min.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/jquery.vanillabox-0.1.5.min.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/retina-1.1.0.min.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/jshashtable-2.1_src.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/jquery.numberformatter-1.2.3.js' %}"
    ></script>
    <script type="text/javascript" src="{% static 'js/tmpl.js' %}"></script>
    <script
      type="text/javascript"
      src="{% static 'js/jquery.dependClass-0.1.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/draggable-0.1.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/jquery.slider.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/markerclusterer_packed.js' %}"
    ></script>
    <script
      type="text/javascript"
      src="{% static 'js/custom-map.js' %}"
    ></script>
    <script type="text/javascript" src="{% static 'js/custom.js' %}"></script>

Изображение ошибок в моем браузере

Ваши статические настройки неверны. Попробуйте следующее:

STATIC_URL = '/static/'
STATICFILES_DIRS = (
    'static',
)
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')

Обратите внимание, что BASE_DIR дает вам каталог вашего проекта. Поэтому, когда вы делаете os.path.join(BASE_DIR, 'myproject/static'), это становится myproject/myproject/static.

Вернуться на верх