如何在 django 中为 css 和 javascript 使用静态文件夹？答案

【问题标题】：how to use static folder in django for css and javascript?如何在 django 中为 css 和 javascript 使用静态文件夹？
【发布时间】：2014-12-26 12:53:05
【问题描述】：

我是 django 框架的新手。我创建了简单的欢迎页面现在我想在我的项目中包含 css 文件。我无法在项目中应用 css 文件。我收到类似“NetworkError：404 NOT”的错误找到 - /static/css/hai.css"

这是我的项目结构

setting.py

BASE_DIR = os.path.dirname(os.path.dirname(__file__))
STATIC_URL = '/static/'
TEMPLATE_DIRS=(
os.path.join(os.path.dirname(BASE_DIR),"static","templates"),
)
if DEBUG:
  MEDIA_URL='/media/'
  STATIC_ROOT=os.path.join(os.path.dirname(BASE_DIR),"static","static-only")
  MEDIA_ROOT=os.path.join(os.path.dirname(BASE_DIR),"static","media")
  STATICFILE_DIRS=(
  os.path.join(os.path.dirname(BASE_DIR),"static","static"),
  )

url.py

if settings.DEBUG:
urlpatterns += static(settings.STATIC_URL,document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL,document_root=settings.MEDIA_ROOT)

base.html

<link href="/static/css/bootstrap.min.css" rel="stylesheet">

我尝试关注链接，但我无法应用 css https://www.youtube.com/watch?v=8t80DMAAps8

【问题讨论】：

您最好使用文档中提供的教程来学习，而不是使用随机的 youtube 视频。

标签： javascript python html css django

【解决方案1】：

我认为这只是一个拼写错误。您需要在STATICFILE 之后放置一个S 因此它应该看起来像：

STATICFILES_DIRS=(
  os.path.join(os.path.dirname(BASE_DIR),"static","static"),
  )

希望这样做。

【讨论】：

【解决方案2】：

Django 在STATIC_URL 访问的STATIC_ROOT 中自动收集静态。将您的“基础”静态信息（如引导程序）放入项目包中（项目包是带有 init.py 的目录）simpleform > static > bootstrap > copy here all tree dirs from bootstrap package: css, fonts, js。并将您的应用程序静态存储在signup > static > also create css, js dirs。

因此，如果 hai.css 是您将在 base.html 中使用的基本 CSS 之一，请将其放入 simpleform > static > css > hai.css。

settings.py

这就是你应该如何提供项目静态数据：

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'simpleform/static'),
)

对于应用程序静态：

STATICFILES_FINDERS = (
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)

您还设置了一个目录，django 应该在其中存储收集到的静态数据和上传的媒体（以及用于访问它们的 url）。例如，将其设置为src > static 和src > media：

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

MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'

simpleform.urls

if settings.DEBUG:
    # static files (images, css, javascript, etc.)
    urlpatterns += patterns(
        '',
        url(r'^media/(?P<path>.*)$', 'django.views.static.serve', {
        'document_root': settings.MEDIA_ROOT}),

        url(r'^static/(?P<path>.*)$', 'django.views.static.serve', {
        'document_root': settings.STATIC_ROOT}),
)

模板

{% load staticfiles %}

<link href="{% static 'bootstrap/css/bootstrap.min.css' %}" rel="stylesheet" media="screen">
<link href="{% static 'css/hai.css' %}" rel="stylesheet" media="screen">

【讨论】：

【解决方案3】：

试着做一个像这样的简单文件

BASE_DIR = os.path.dirname(os.path.dirname(__file__))
OUTER_DIR = os.path.dirname(BASE_DIR)

STATICFILES_FINDERS = (
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)

STATIC_URL = '/static/'

TEMPLATE_DIRS=(
    os.path.join(OUTER_DIR, "static", "templates"),
)

MEDIA_URL='/media/'
STATIC_ROOT = os.path.join(OUTER_DIR, "static", "static-only")
MEDIA_ROOT = os.path.join(OUTER_DIR, "static", "media")

STATICFILE_DIRS=(
    os.path.join(OUTER_DIR, "static"),
)

然后，在您的代码中使用{% static %} 模板标签。

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

用

测试一下

DEBUG = True
TEMPLATE_DEBUG = DEBUG

如果你关闭DEBUG那么你需要添加

if not settings.DEBUG:
    urlpatterns += static(settings.STATIC_URL,document_root=settings.STATIC_ROOT)
    urlpatterns += static(settings.MEDIA_URL,document_root=settings.MEDIA_ROOT)

当你现在拥有它时，它不是。

templates 目录不应该在static 文件夹中。一般来说，templates 和 static 所需的特定文件应该在您的 Django 项目中，而不是分开。

【讨论】：