日常Tips

sass启用@import，分改为@use用于定义@forward用于引入。

在vite或者vue.config中全局引入sass中现在需要更改为@use引入并定义别名

在页面使用中，需要用别名+变量名引用sass样式表内容

export default defineConfig({
  css:{
    preprocessorOptions: {
      scss: {
        additionalData: `
          @use "@/assets/styles/color.scss" as color;
        `
      }
    }
  }
})

<style scoped lang="scss">
.main{
  width: 100%;
  background-color: color.$bg-color;
}
</style>