安装

npm i --save-dev sass

配置

在vite.config.js中配置scss文件

export default defineConfig({
  plugins: [
    vue(),
    Components({
      resolves: [VantResolver()],
    }),
  ],
  css:{
      //此处配置
    preprocessorOptions:{
      scss:{
        additionalData:"@import './src/assets/styles/variables.scss';"
      },
    }
  }
})

文件位置

使用

//variables.scss
$primary: #fc3c0c;

<style lang="scss">
.account{
    min-height: 100%;
    background-color: #f5f5f5;
    .logout{
        display: block;
        margin: 0 auto;
        width: 90%;
        margin-top: 20px;
        background-color: $primary;         //sass
        border-color: $primary;
    }
}
</style>