如何在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";',
      },
    },
  },
相关推荐
006_4 分钟前
Java8的lambda用法总结
前端·数据库
minglie17 分钟前
mqtt接入事件回调测试
前端·javascript
Luna-player23 分钟前
Webpack vs Vite
前端·vue.js·webpack
我是初九24 分钟前
【遇见狂神说|前端】HTML5
前端·html
Cg1362691597427 分钟前
js引入方式
前端·javascript·ajax
J超会运31 分钟前
从零部署Nginx:Web全栈实战指南
运维·前端·nginx
-SOLO-38 分钟前
chrome插件 将网页转化为markdown
前端·chrome
酉鬼女又兒43 分钟前
零基础入门Web应用开发(备赛蓝桥杯)_网页布局原理
前端·职场和发展·蓝桥杯·html5
zzh0811 小时前
web技术与nginx网站环境部署
运维·前端·nginx
3Katrina1 小时前
RAG技术全拆解:让大模型告别“瞎编”,秒变靠谱助手
前端