【问题标题】:A simple example of Django and CSS一个简单的Django和CSS示例
【发布时间】:2012-02-27 02:16:17
【问题描述】:

我是 Django 新手,正在尝试设置一个非常简单的 Django 应用程序。

现在,我已经到了 Django 在线书籍的第 5 章:http://www.djangobook.com/en/2.0/chapter05/

在我开始尝试数据库之前,我现在要做的就是将一些简单的 CS 和 J 按原样添加到应用程序中。

所以问题是,我该怎么做?我只有一个应用程序,我只想要一个 css 文件夹中的 main.css 和 js 文件夹中的 main.js。

我查看了https://docs.djangoproject.com/en/1.3/howto/static-files/#staticfiles-in-templates 页面,但在阅读和阅读之后,在示例方面似乎没有太多可使用的。

如何导入样式表/css(有没有像 CakePHP 这样的助手?),CSS 和 JS 文件放在哪里,需要配置静态的东西吗?

更新:链接:Render CSS in Django 没有多大帮助。主要是因为它对我不起作用,而且我特别不喜欢“如果调试”部分。当我转向 prod 时会发生什么?为什么我要为 prod 和 local dev 定义不同的媒体文件夹?不应该是相对的,甚至是在同一个地方吗?

【问题讨论】:

  • stackoverflow.com/questions/4035964/… 我认为这可能是您想要查看的 SO 页面。
  • @JohnRiselvato 这可能不是最好的,因为在 Django 1.2 和 1.3 之间,静态文件的处理发生了显着变化,包括 staticfiles 应用程序。

标签: css django


【解决方案1】:

我终于在很多天后得到了应该怎么做 1> 您需要在您的应用程序和项目中使用您的静态文件 2> 这里是setting.py

   if DEBUG:
   STATIC_ROOT = "/PycharmProjects/don/admin/shopping/static/css"

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

3>views.py

        from django.views.generic import TemplateView
        class HomeView(TemplateView):
               template_name = 'index.html'

4> 模板文件

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

5> urls.py

            from shopping.views import HomeView 
             from django.conf import settings
             from django.conf.urls.static import static
           urlpatterns = [
            url(r'^admin/', admin.site.urls),
             url(r'^$', HomeView.as_view())
          ]
        if settings.DEBUG:
       urlpatterns+=static(settings.STATIC_URL,document_root=settings.STATIC_ROOT)

6>     python manage.py collectstatic  

have fun :)

【讨论】:

    【解决方案2】:

    推荐的方法又变了(我认为至少从 Django 1.5 开始)。

    在模板的顶部放置:

    {% load staticfiles %}
    

    然后,使用相同的目录结构(myapp/static/myapp/style.css):

    <link rel="stylesheet" href="{% static 'myapp/style.css' %}" />
    

    Source

    【讨论】:

    • 现在有了这种处理静态文件的简单好方法,生活变得简单多了;-)
    • 是的,如 1.9 文档中所示:docs.djangoproject.com/en/1.9/howto/static-files
    • 如果{% load staticfiles %} 不起作用,您会看到错误提示TemplateSyntaxError,请将staticfiles 更改为static 或您自己的静态文件文件夹名称,它应该可以工作;-)
    【解决方案3】:

    如果你遵循 django 的指导方针,你可以大大简化你的生活。

    在您的示例代码中,在您的 application 目录中,创建一个名为 static 的文件夹。在此文件夹中,放置您的 css 文件。

    例子:

    $ django-admin.py startproject myproject
    $ cd myproject
    myproject$ python manage.py startapp myapp
    myproject$ mkdir myapp/static
    myproject$ cd myapp/static
    myproject/myapp/static$ nano style.css
    

    在您的模板中:

    &lt;link rel="stylesheet" href="{{ STATIC_URL }}style.css" /&gt;

    确保将myapp 添加到settings.pyINSTALLED_APPS 列表中。现在,当您使用内置的开发服务器时,您的样式表将正确呈现。

    Django 默认在已安装的应用程序中搜索static 目录,而在当前版本的 Django 中,默认启用静态文件。


    Django 示例的路径 my_app/static/my_app/myimage.jpg 如果您的应用和项目具有相同的名称,这会有点混乱。

    这是推荐的,因为当您运行collectstatic 来收集所有静态文件时,同名文件将被覆盖。如果您在另一个应用程序中有一个名为myimage.jpg 的文件,它将被覆盖。在静态目录中提供应用程序名称将防止这种情况发生,因为确切的目录结构将在您的 STATIC_ROOT 目录中复制。

    一个简单的例子来说明这一点。如果你有一个包含两个应用的 django 项目,像这样:

    .
    ├── assets
    ├── manage.py
    ├── myapp
    │   ├── __init__.py
    │   ├── models.py
    │   ├── static
    │   │   └── myapp
    │   │       └── test.txt
    │   ├── tests.py
    │   └── views.py
    ├── myproj
    │   ├── __init__.py
    │   ├── __init__.pyc
    │   ├── settings.py
    │   ├── settings.pyc
    │   ├── urls.py
    │   └── wsgi.py
    └── otherapp
        ├── __init__.py
        ├── models.py
        ├── static
        │   └── otherapp
        │       └── test.txt
        ├── tests.py
        └── views.py
    

    assets 是您的STATIC_ROOT。现在当你运行collectstatic:

    .
    ├── assets
    │   ├── myapp
    │   │   └── test.txt
    │   └── otherapp
    │       └── test.txt
    ├── manage.py
    ├── myapp
    │   ├── __init__.py
    │   ├── __init__.pyc
    │   ├── models.py
    │   ├── static
    │   │   └── myapp
    │   │       └── test.txt
    │   ├── tests.py
    │   └── views.py
    ├── myproj
    │   ├── __init__.py
    │   ├── __init__.pyc
    │   ├── settings.py
    │   ├── settings.pyc
    │   ├── urls.py
    │   └── wsgi.py
    └── otherapp
        ├── __init__.py
        ├── __init__.pyc
        ├── models.py
        ├── static
        │   └── otherapp
        │       └── test.txt
        ├── tests.py
        └── views.py
    

    您会看到它也在创建目录。在您的模板中,您现在可以使用应用程序的“命名空间”来引用每个文件:{{ STATIC_URL }}/myapp/test.txt

    【讨论】:

    • 谢谢。 Django 示例的路径 my_app/static/my_app/myimage.jpg 如果您的应用程序和项目具有相同的名称,这会有点令人困惑。
    • 这是为了防止文件被覆盖。
    • 抱歉复活死者,但是在这种情况下,STATIC_URL 的值会是什么?
    • 这对 Django 2 不再有效。请更新接受的答案@Burhan Khalid:docs.djangoproject.com/en/2.0/howto/static-files
    【解决方案4】:

    在 Django 1.3 中,静态文件的处理发生了显着变化(变得更好)。特别是静态文件(想想需要 CSS/JS/图像的代码)和媒体文件(想想用户在使用您的应用程序时上传的图像)之间的灵活区别。 staticfiles 应用程序可以处理您的要求。

    django.contrib.staticfiles 放入您的settings.py INSTALLED_APPS。然后在您的应用程序目录中创建一个static 目录 - 所以project/app/static/。在该静态目录中根据需要组织您的支持文件(css/、js/、images/、icons/ 等)。 staticfiles 默认会在 static/ 目录中查找 INSTALLED_APPS 中列出的每个应用程序。不仅是您自己的,还有所有 Django 应用程序和第三方应用程序。 (旁注:Django 1.4 中的 Admin 移至此范例,而在 1.3 中它仍然使用 ADMIN_MEDIA_PREFIX)。

    staticfiles 应用程序知道所有应用程序中的所有静态/目录,但它需要收集所有这些内容才能提供服务。在开发中,当使用manage.py runserver 时,它会为您处理。 Django 将运行您的站点并自动提供来自所有静态源的所有静态内容。 (源,如另一个答案中所述,在 STATICFILES_FINDERS 设置中设置。)不使用 runserver 时,使用manage.py collectstatic 将所有静态文件收集到STATIC_ROOT 中定义的文件夹中。 保持这个目录为空。 这是一个收集目的地。当然,您的网络服务器需要配置为服务于该目录。

    现在还有一件 - 视图。这就是STATIC_URL 发挥作用的地方。在模板中引用静态文件时,最简单的方法是使用{{ STATIC_URL }}。默认情况下,Django 使用 RequestContext 使该变量可用于任何视图。做这样的事情 - &lt;link rel="stylesheet" href="{{ STATIC_URL }}/css/main.css" /&gt;

    有关在模板中引用 STATIC_URL 的更多信息和更多方法,请查看this answer 以回答类似问题。

    【讨论】:

    • 现在它应该在 {{ STATIC_URL }} 之后没有斜线,例如
    【解决方案5】:

    要使examples you pointed at 工作,您的静态文件需要位于 Django 的内置 staticfiles 应用程序可以访问的位置。

    有几个步骤可以做到这一点:

    首先,在您的项目目录中(即在您的manage.py 文件旁边),您需要创建一个目录来保存您的静态文件。称之为“static_files”。

    接下来,您需要通过在 settings.py 文件中的 STATICFILES_DIRS 列表中指定该目录,让 Django 知道查看该目录。

    类似这样的:

    STATICFILES_DIRS = [
        '/full/path/to/your/project/static_files/',
    ]
    

    static_files 目录中,您可以创建任何您想要的结构,这样您的cssjs 目录就可以放在其中。

    之后,您应该可以在模板中使用 {{ STATIC_URL }} 标记来访问静态文件的基本 URL。

    比如说,你创建了project/static_files/css/base.css,你会像这样在你的模板中使用它:

    <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}/css/base.css" />
    

    希望有帮助!

    编辑

    使用STATICFILES_FINDERS 的默认设置,Django 应该会自动提供您的 STATICFILES_DIRS 中列出的目录中的所有文件——有关详细信息,请参阅the docs

    如果这不起作用,请检查以下内容:

    • 您是否已将您的 STATICFILES_FINDERS 设置编辑为非默认设置?
    • django.contrib.staticfiles 是否在您的INSTALLED_APPS 列表中settings.py 中?
    • 您使用的是 Django 的内置服务器(python manage.py runserver)吗?
    • 您的settings.py 中有DEBUG = True 吗?如果没有,您需要将其设置为True 或使用the insecure option (python manage.py runserver --insecure)。投入生产时,请查看collectstatic command

    【讨论】:

    • 那行不通。嗯,href 中的 static_url 获取了 settings.py 文件中 static_url 的值,该文件似乎没有任何直接链接(无论如何,根据您的说明)到 staticfiles_dirs 变量。我是否打算以某种方式将两者联系起来?
    • 我相信在STATICFILES_FINDERS 的默认设置下,Django 应该自动提供STATICFILES_DIRS 中列出的目录中的所有文件——详情请参阅the docs。您是否将您的STATICFILES_FINDERS 设置编辑为默认值以外的其他设置? django.contrib.staticfiles 在您的INSTALLED_APPS 列表中吗?另外,为了确定,您使用的是 Django 的内置服务器,对吧 (python manage.py runserver)?
    猜你喜欢
    • 2013-12-08
    • 1970-01-01
    • 2018-01-19
    • 2013-05-24
    • 1970-01-01
    • 2020-01-20
    • 2016-12-02
    • 2020-12-12
    相关资源
    最近更新 更多