Frontend – SASS / SCSS 文件使用

目录

一、安装所需依赖

1. django-compressor 

2. django-sass-processor

二、settings.py 文件配置

三、html使用

1. 配置

2. 导入


一、安装所需依赖

1. django-compressor 

2. django-sass-processor

安装依赖,可参考另一篇文章:Backend - 安装依赖(pip 、tar.gz)_python通过tar.gz包安装依赖包-CSDN博客

二、settings.py 文件配置

# settings.py
INSTALLED_APPS = [
      …
    'sass_processor',
]
STATICFILES_FINDERS = [
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
    'sass_processor.finders.CssFinder',
]
SASS_PROCESSOR_ROOT = os.path.join(BASE_DIR, "luoboPro/static/")
# 或者 SASS_PROCESSOR_ROOT = os.path.join(BASE_DIR,'static','css')

三、html使用

1. 配置

 {% load sass_tags %}

2. 导入

<link rel="stylesheet nofollow" type="text/css"  href="{% sass_src 'scss/xxx/xxx.scss' %}">