如何在vue项目中引入并使用scss样式进行详细改写？

本文共计1127个文字，预计阅读时间需要5分钟。

目录+前言+一、SCSS 是什么？（与 SCSS 的区别）+二、如何在 Vue 项目中引入 SCSS+1. 安装 Sass 的依赖包+2. 安装 sass-loader 依赖及 node-sass+3. 配置 vue.config.js 文件+4. 在 App.vue 文件中使用 SCSS+补充：Vue 如何使用 SCSS

目录

• 前言
• 一、scss是什么？(和sass的区别)
• 二、如何在vue项目中引入scss
• 1.安装sass的依赖包
• 2.sass-loader依赖于node-sass,安装node-sass
• 3.配置vue.config.js文件
• 4.在App.vue文件中使用sass
• 补充：vue如何使用scss的全局变量
• 总结

前言

小白记录如何在vue项目中引入scss,并使用scss样式

提示：以下是本篇文章正文内容，下面案例可供参考

一、scss是什么？(和sass的区别)

scss是一种css预处理语言，是一个css的扩展，它在css语法的基础上，允许您使用变量，嵌套规则，混合，导入，继承等功能，使得css更加强大和优雅，而且其完全兼容css3。