首页 前端知识 如何在vue3中使用scss

如何在vue3中使用scss

2025-03-20 12:03:29 前端知识 前端哥 951 886 我要收藏

要使用scss首先需要下载相关的包
可以在终端使用下面的命令下载相关包

npm install -D sass

在src文件下新建一个文件夹叫做styles
在这里插入图片描述
在文件夹下创建三个文件
index.scss主要用来引用其他文件
reset.scss用来清除默认的样式
variable.scss用来配置全局属性

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

在这里插入图片描述

代码如下

css: {
    preprocessorOptions: {
      scss: {
        javascriptEnabled: true,
        additionalData: '@import "./src/styles/variable.scss";',
      },
    },
  },

在这里插入图片描述

转载请注明出处或者链接地址:https://www.qianduange.cn//article/24129.html
标签
评论
发布的文章

动态规划感悟1

2025-03-20 12:03:52

华为NAS真实测评!

2025-03-20 12:03:52

Java设计模式之代理模式

2025-03-20 12:03:51

Linux 锁、线程同步

2025-03-20 12:03:48

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!