2014-09-23 49 views
1

我們打算擴展openstack的Horizo​​n,這是一個Django應用程序。第一個目標:添加一些自定義CSS。我們的方法是創建一個自己的Django項目,並在settings.py中導入Horizo​​n的默認設置(「from openstack_dashboard.settings import *」)。在導入之後,我們通過在原始Horizo​​n目錄之前添加自定義模板目錄來擴展TEMPLATE_DIRS。模板目錄是BASE_DIR/templates。它是文件_stylesheets.html。Django包含錯誤的生成/壓縮CSS文件

在調試/開發模式(Django提供正確的模板和CSS)時,此方法可以很好地工作。但是,當我們在關閉調試模式下部署應用程序時,我們的自定義CSS代碼沒有正確包含在內。有趣的部分是Django實際上生成了兩個CSS文件:一個包含一部分,另一個沒有我們的添加。它包含了自定義CSS類的一部分。

這裏是模板的內容:

{% load compress %} 

{% compress css %} 
<link href='{{ STATIC_URL }}bootstrap/less/bootstrap.less' type='text/less' media='screen' rel='stylesheet' /> 
<link href='{{ STATIC_URL }}bootstrap/less/datepicker.less' type='text/less' media='screen' rel='stylesheet' /> 
<link href='{{ STATIC_URL }}dashboard/less/rickshaw.css' type='text/css' media='screen' rel='stylesheet' /> 
<link href='{{ STATIC_URL }}dashboard/less/horizon_charts.less' type='text/less' media='screen' rel='stylesheet' /> 
<link href='{{ STATIC_URL }}dashboard/less/horizon_workflow.less' type='text/less' media='screen' rel='stylesheet' /> 
<link href='{{ STATIC_URL }}custom.less' type='text/less' media='screen' rel='stylesheet' /> 
{% endcompress %} 

<link rel="shortcut icon" href="{{ STATIC_URL }}dashboard/img/favicon.ico"/> 

在發展方式的文件轉換到每一個CSS:

<link media="screen" type="text/css" href="/static/dashboard/css/bootstrap.699284425211.css" rel="stylesheet"> 
<link media="screen" type="text/css" href="/static/dashboard/css/datepicker.39a8e5b9c87f.css" rel="stylesheet"> 
<link rel="stylesheet" media="screen" type="text/css" href="/static/dashboard/less/rickshaw.css"> 
<link media="screen" type="text/css" href="/static/dashboard/css/horizon_charts.985669de17ce.css" rel="stylesheet"> 
<link media="screen" type="text/css" href="/static/dashboard/css/horizon_workflow.aa358dadad47.css" rel="stylesheet"> 
<link media="screen" type="text/css" href="/static/dashboard/css/custom.f2648785ac78.css" rel="stylesheet">` 

在生產中,它看起來如下(manage.py collectstatic和壓縮後):

<link media="screen" type="text/css" href="/static/dashboard/css/571c5f6c29ad.css" rel="stylesheet"> 

但它應該包括6176ec5928 68.css。見編輯1.所有可用的css文件:

# find generated/static/ -name "*.css" 
generated/static/dashboard/less/rickshaw.css 
generated/static/dashboard/css/571c5f6c29ad.css 
generated/static/dashboard/css/6176ec592868.css 
generated/static/horizon/lib/jasmine-1.3.1/jasmine.css 
generated/static/horizon/lib/qunit/qunit.css 

我們已經檢查了INSTALLED_APP和TEMPLATE_DIRS順序是正確的(我們的東西是第一位)。我們陷入困境 - 你有什麼想法在哪裏看下?

編輯1:我只是注意到,實際上是6176ec592868.css只包含老CSS的東西,571c5f6c29ad.css似乎與我們的修改不完整的CSS文件。所以這個問題稍有不同:爲什麼在開發模式下會發生所有事情都能正確轉換爲.css,但是「manage.py compress」反過來並不能正確收集所有較少的文件?

回答

0

地平線默認情況下使用lesscpy(python)而不是lessc(javascript)。顯然lesscpy不喜歡我們的少代碼。

所以我們改變了這個:

COMPRESS_PRECOMPILERS = (
    ('text/less', 'lesscpy {infile}'), 
) 

要這樣:

COMPRESS_PRECOMPILERS = (
    ('text/less', 'lessc {infile} {outfile}'), 
) 

lessc喜歡我們更少的代碼更和它的作品!