如何在vue3中使用scss

一

要使用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";',
      },
    },
  },