sass1.8.0中 @import Deprecation Warning解决办法

kaixing1967

已于 2024-10-24 15:54:36 修改

阅读量7.4k

点赞数 6

文章标签： 1024程序员节

于 2024-10-24 15:53:57 首次发布

本文链接：https://blog.youkuaiyun.com/kaixing1967/article/details/143210418

版权

sass 1.8.0后将不再支持 @import 需要使用 `@use’
官方文档

1、Sass @import rules are deprecated and will be removed in Dart Sass
3.0.0

修改方法:

@use "@/variables.scss";

2、Deprecation Warning: Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0.；
Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
sass 1.80 不再支持全局内置函数、老的 js api 接口

修改方法 vue.config.js:

export default defineConfig({
  ...
  css: {
    preprocessorOptions: {
      scss: {
        api: 'modern-compiler', // 修改api调用方式
      },
    },
  },
  ...
});

3. Internal server error: [sass] Undefined variable.

sass 1.80 全局变量和 mixin 需要手动导出

修改方法 vue.config.js:

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