Frontend - SASS / SCSS 文件使用

目录

一、安装所需依赖

[1. django-compressor](#1. django-compressor)

[2. django-sass-processor](#2. django-sass-processor)

[二、settings.py 文件配置](#二、settings.py 文件配置)

三、html使用

[1. 配置](#1. 配置)

[2. 导入](#2. 导入)


一、安装所需依赖

1. django-compressor

2. django-sass-processor

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

二、settings.py 文件配置

python 复制代码
# 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. 配置

html 复制代码
 {% load sass_tags %}

2. 导入

html 复制代码
<link rel="stylesheet nofollow" type="text/css"  href="{% sass_src 'scss/xxx/xxx.scss' %}">
相关推荐
quweiie16 分钟前
tp8.0\jwt接口安全验证
前端·安全·jwt·thinkphp
xiaoyan201532 分钟前
最新Flutter3.32+Dart3仿微信App聊天实例
前端·flutter·dart
汪敏wangmin1 小时前
Fiddler-抓包后直接生成Loadrunner脚本或者Jmeter脚本
前端·jmeter·fiddler
彤银浦2 小时前
Web学习笔记3
前端·笔记·学习·html5
江城开朗的豌豆2 小时前
退出登录后头像还在?这个缓存问题坑过多少前端!
前端·javascript·vue.js
江城开朗的豌豆2 小时前
Vue的'读心术':它怎么知道数据偷偷变了?
前端·javascript·vue.js
江城开朗的豌豆2 小时前
手把手教你造一个自己的v-model:原来双向绑定这么简单!
前端·javascript·vue.js
我在北京coding2 小时前
el-tree 懒加载 loadNode
前端·vue.js·elementui
江城开朗的豌豆2 小时前
v-for中key值的作用:为什么我总被要求加这个'没用的'属性?
前端·javascript·vue.js
angen20182 小时前
Ruby如何采集直播数据源地址
前端·chrome