如何在vue3中使用scss

要使用scss首先需要下载相关的包

可以在终端使用下面的命令下载相关包

npm install -D sass

在src文件下新建一个文件夹叫做styles

在文件夹下创建三个文件

index.scss主要用来引用其他文件

reset.scss用来清除默认的样式

variable.scss用来配置全局属性

需要在vite.config.ts中配置一个全局配置

代码如下

css 复制代码
css: {
    preprocessorOptions: {
      scss: {
        javascriptEnabled: true,
        additionalData: '@import "./src/styles/variable.scss";',
      },
    },
  },
相关推荐
jump_jump10 分钟前
SaaS 时代已死,SaaS 时代已来
前端·后端·架构
Yanni4Night31 分钟前
Parcel 作者:如何用静态Hermes把JavaScript编译成C语言
前端·javascript·rust
hellokatewj32 分钟前
前端 Promise 全解:从原理到面试
前端
天意pt41 分钟前
Blog-SSR 系统操作手册(v1.0.0)
前端·vue.js·redis·mysql·docker·node.js·express
遗憾随她而去.43 分钟前
Webpack5 高级篇(一)
前端
疯狂踩坑人1 小时前
【React 19 尝鲜】第一篇:use和useActionState
前端·react.js
毕设源码-邱学长1 小时前
【开题答辩全过程】以 基于VUE的打车系统的设计与实现为例,包含答辩的问题和答案
前端·javascript·vue.js
用户39051332192881 小时前
JS判断空值只知道“||”?不如来试试这个操作符
前端·javascript
海云前端11 小时前
前端面试必问 asyncawait 到底要不要加 trycatch 90% 人踩坑 求职加分技巧揭秘
前端
wuk9982 小时前
梁非线性动力学方程MATLAB编程实现
前端·javascript·matlab