我正在尝试包含不在乐队应用程序中的静态文件,但是在一个名为 static 的单独目录中。
此目录包含构建目录,其中包含CSS& JS目录。
除了CSS和JS目录中的文件外,我还想在 bower_components 目录中包含jquery,react和浏览器等缩小文件。
我的项目结构如下:
Music/
├── band/
│ ├── migrations/
│ ├── __init__.py
│ ├── admin.py
│ ├── apps.py
│ ├── models.py
│ ├── serializers.py
│ ├── tests.py
│ ├── urls.py
│ └── views.py
├── music/
│ ├── __init__.py
│ ├── settings.py
│ ├── urls.py
│ ├── views.py
│ └── wsgi.py
├── node_modules/
├── static/
├──── static/
│ ├── bower_components/
│ ├── build/
│ ├── css/
│ ├── images/
│ └── js/
├── templates/
├── band/
├── MasterPages/
├── index.html
音乐中的我的settings.py包含以下内容:
STATIC_URL = '/static/'
STATIC_ROOT = 'C:/Users/Broski/PycharmProjects/Music/static'
MEDIA_ROOT = 'C:/Users/Broski/PycharmProjects/Music/upload'
此MasterPage.html文件位于模板下的 MasterPages 目录中:
{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>Music</title>
<link rel="stylesheet" href="{% static 'build/css/main.css' %}" type="text/css" />
</head>
<body>
{% block content %}
{% endblock %}
<script src="{% static 'bower_components/jquery/dist/jquery.min.js' %}"></script>
<script src="{% static 'bower_components/react/react.min.js' %}"></script>
<script src="{% static 'bower_components/babel/browser.min.js' %}"></script>
<script type="text/babel" src="{% static 'build/js/indexReact.js' %}"></script>
</body>
</html>
当我加载网站时,模板呈现但静态文件却没有。我收到404错误。
GET http://127.0.0.1:8000/static/css/main.css
127.0.0.1/:22 GET http://127.0.0.1:8000/static/bower_components/jquery/dist/jquery.min.js
127.0.0.1/:23 GET http://127.0.0.1:8000/static/bower_components/react/react.min.js
127.0.0.1/:26 GET http://127.0.0.1:8000/static/bower_components/babel/browser.min.js 404 (Not Found)
正如您所看到的,我需要正确加载React,Jquery和Browser才能继续这个youtube教程:
Building a website with Django and React.js Video 1: Defining our project structure
谢谢
答案 0 :(得分:7)
固定。
我困惑 STATIC_ROOT 和 STATICFILES_DIRS
因此我删除了static_root并替换为:
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static/'),
)
其中base dir只指向我的项目文件夹。