Django - pipeline
Web/Django

Django - pipeline

뉴비뉴 2020. 1. 31.

의존성, 배포관리

 

http://guswnsxodlf.github.io/django-bower-pipeline

 

bower와 pipeline을 이용한 Django 의존성, 배포 관리

들어가며Django 뿐만 아니라 웹 프레임워크로 개발을 하다 보면, 프론트엔드(javascript) 부분의 의존성을 관리해줘야 한다. AngualrJs나 ReactJs, BackboneJs 경우에는 프론트엔트 프레임워크이므로 bower나 npm의 package.json으로 관리하고...

guswnsxodlf.github.io

 

프로젝트가 엄청나게 커졌다고 생각해보자, css 파일이 300개가 되었다고 가정하였을 때 의존성 관리란 쉽지 않다.

Django 에서는 django-pipeline을 이용하여 static 파일들을 쉽게 관리할 수 있도록 기능을 제공 해준다.

 

 

https://django-pipeline.readthedocs.io/en/latest/

 

Introduction — django-pipeline 1.6.14 documentation

Introduction Pipeline is an asset packaging library for Django, providing both CSS and JavaScript concatenation and compression, built-in JavaScript template support, and optional data-URI image and font embedding. You can report bugs and discuss features

django-pipeline.readthedocs.io

 

설치방법은 위 링크를 참고하면 됩니다.

 

Installation

 

pip install django-pipeline

 

INSTALLED_APPS = [

    'pipeline',

]



STATICFILES_STORAGE = 'pipeline.storage.PipelineCachedStorage'
# 저장을 할 때 collectstatic 을 할 때 캐슁을 해서 저장을 하겠다라는 설정입니다.



STATICFILES_FINDERS = (
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
    # 위 설정은 기본 설정
    
    'pipeline.finders.PipelineFinder',
    # pipeline 배포환경에서 css파일을 대신 찾을 수 있게 넣어준다.
)





PIPELINE = {

    'STYLESHEETS': {
        'projectname': { # stats라는 이름으로
            'source_filenames': ( # source 파일들을 다 합쳐서
                'css/application.css',
                'css/partials/*.css',
            ),
            'output_filename': 'css/projectname.css' # 해당 파일로 압축해준다.
        }
    },
}

 

 

Usage

{% load pipeline %}<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
{% stylesheet 'djtube' %}
<title>Document</title>
</head>

 

 

이렇게하면 설정이 다 끝났습니다.

가장 큰 장점은 만약 현재 css 파일에서 새로운 css 파일이 추가된다고 하면

css 폴더 안에 생성해주면 자동으로 불러와서 적용이 된다는 것 입니다.

 

[번외] collectstatic

manage.py collectstatic 을 실행하게되면 2개의 작업이 이루어진다.

첫 째, 프로젝트 내의 모든 css, js 파일들을 Copy

둘 째, Post-processed 작업이 이루어진다. 이 작업에서는 코드의 minify와 캐슁이 진행된다.

댓글

💲 추천 글