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' %}">
相关推荐
haogexiaole39 分钟前
vue知识点总结
前端·javascript·vue.js
哆啦A梦15883 小时前
[前台小程序] 01 项目初始化
前端·vue.js·uni-app
小周同学@5 小时前
谈谈对this的理解
开发语言·前端·javascript
Wiktok5 小时前
Pyside6加载本地html文件并实现与Javascript进行通信
前端·javascript·html·pyside6
一只小风华~5 小时前
Vue:条件渲染 (Conditional Rendering)
前端·javascript·vue.js·typescript·前端框架
柯南二号5 小时前
【大前端】前端生成二维码
前端·二维码
程序员码歌6 小时前
明年35岁了,如何破局?说说心里话
android·前端·后端
博客zhu虎康7 小时前
React Hooks 报错?一招解决useState问题
前端·javascript·react.js
灰海7 小时前
vue中通过heatmap.js实现热力图(多个热力点)热区展示(带鼠标移入弹窗)
前端·javascript·vue.js·heatmap·heatmapjs
王源骏7 小时前
LayaAir鼠标(手指)控制相机旋转,限制角度
前端