Question

我有一个django项目，我做了compass init来制作新的罗盘文件夹。当我在其中进行更改时，我的指南针/ sass正在编译，但我的模板没有采取任何这些更改或正常工作 - 在调试器中我收到404错误加载＆＃39; screen.css＆＃39;，但它找到了bootstrap正常。

在base.htm中，所有模板都扩展：

{% block main_header %}
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Sitename</title>
        <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.css" rel="stylesheet">
        {% block custom_stylesheets %}{% endblock %}
        <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" />
</head>
{% endblock %}

在settings.py中：

INSTALLED_APPS = (
    ...
    'bootstrapform',
    'djcompass',
)

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

MEDIA_URL = '/media/'

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

STATIC_URL = '/static/'

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'staticfiles'),
)

SETTINGS_PATH = os.path.dirname(__file__)
PROJECT_PATH = os.path.join(SETTINGS_PATH, os.pardir)
PROJECT_PATH = os.path.abspath(PROJECT_PATH)

    os.path.realpath(os.path.dirname(__file__)) + '/templates/',
)

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates')],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

在screen.scss中：

@import "compass/reset";
@import "partials/weekly_schedule";

_weekly_schedule.scss中的

：

@import 'compass/css3/box-shadow';
@import 'compass/css3/box-sizing';

.tabbed-content-box{
    border-radius: 6px;
    padding: 16px 5px 5px 5px;
}
...etc...

在相关模板中，weekly_schedule.htm：

{% extends 'base.htm' %}
{% load extras form_fields bootstrap %}

{% block body_block %}
    <form id="schedule_form" method="post" action="{% url 'owners:weekly_schedule' biz.slug %}"
            enctype="multipart/form-data">
        {% csrf_token %}

        {% for i in 7|get_range %}
            {% day_field day_dict i schedule_form %}
        {% endfor %}

<div style="clear;"></div>
<br/>

   <input type="submit" name="submit" value="Set schedule" />

    <button type="button" onclick="myFunction()">Try it</button>

{% endblock %}

过去，我的问题在于导入＆＃39; compass / css3＆＃39;这是没有意义的，因为我开始了罗盘项目。现在不再紧张。我的screen.css似乎编译得很好，比如

/* line 93, ../sass/partials/_weekly_schedule.scss */
.faketestthingy {
  background-color: red;
}

在我做了一个虚假的条目之后。最重要的是，在config.rb中，它位于项目的根级别（罗盘初始化的地方）我有：

#http_path = "/home/myname/django_practice/scheduler_app"
http_path = "/"
css_dir = "stylesheets"
sass_dir = "sass"

我已经尝试了两个http_paths，但无济于事。我不记得为什么我过去改变了我的PROJECT_PATH（这是一个静态文件的东西），但我尝试了没有绝对路径。我尝试更改所有具有＆＃34; static / staticfiles＆＃34;的媒体设置。 to＆＃34; stylesheets＆＃34;，仍然在screen.css上404。任何指针都非常感激。谢谢 enter image description here

Answer 1

如果您希望以这种方式保持布局，则需要将stylesheets添加到STATICFILES_DIRS：

1）更新STATICFILES_DIRS

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'staticfiles'),
    os.path.join(BASE_DIR, 'stylesheets'),
)

2）更新base.html

- 加载staticfiles
- 使用{% static %}标记

嵌入样式表

{% load staticfiles %}
{% block main_header %}
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Sitename</title>
        <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.css" rel="stylesheet">
        {% block custom_stylesheets %}{% endblock %}
        <link href="{% static "screen.css" %}" media="screen, projection" rel="stylesheet" type="text/css" />
</head>
{% endblock %}

更新： 为什么它在

之前无效

特别是在开始时，需要花一些时间来分离Django所谓的静态和媒体文件以及驱动应用程序的Python / Django代码。

重要的是，从您的目录布局，您的网络服务器无法访问任何目录。这就是为什么如果我们想要使用自定义目录布局，我们需要告诉Django我们放置静态资产的目录（css，javascript，images，fonts，..）。我们通过添加STATICFILES_DIRS设置来实现这一点：

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'staticfiles'),
    os.path.join(BASE_DIR, 'stylesheets'),
)

现在Django知道要在这两个目录中查找静态文件。这是第一步。

下一个重要的是STATIC_URL设置：

STATIC_URL = '/static/'

这告诉Django公开静态文件的基本URL。假设我们有这些文件

/staticfiles/
    logo.jpg
    bg_tile.png
    js/
      app.js  
/stylesheets/
    styles.css
    styles_mobile.css

通过上述设置，Django将在我们在STATIC_URL中定义的命名空间下提供唯一的设置，这意味着我们可以像这样访问它们：

http://example.com/static/logo.jpg
http://example.com/static/bg_tile.png
http://example.com/static/js/app.js
http://example.com/static/styles.css
http://example.com/static/styles_mobile.css

长话短说，独立于他们的实际位置Django通过独特的/static/网址访问它们。

这就是<link href="/stylesheets/style.css".../>无效的原因。网络服务器（在开发可能runserver时，在生产中就像nginx或apache）只是对stylesheets目录一无所知。

所以最后一步是使用Django的static模板标签来创建链接。这可以确保如果您更改了STATIC_URL设置（例如从/static/更改为/assets/），则无需触摸任何模板，因为{% static %}正确解析了你。

一旦将应用程序部署到实际站点，它就会更多地涉及（但不是那么多），但我希望这些信息足以帮助您入门。

在django项目中找不到正确编译的screen.css指南针/ sass

1 个答案: