uni-app DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0

发布于 1周前 作者 sinazl 来自 Uni-App

uni-app DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0

开发环境 版本号 项目创建方式
Windows win11 HBuilderX

产品分类:uniapp/App
PC开发环境操作系统:Windows
HBuilderX类型:正式
HBuilderX版本号:4.29
手机系统:Android
手机系统版本号:Android 15
手机厂商:华为
手机机型:华为
页面类型:vue
vue版本:vue3
打包方式:云端

示例代码:

01:04:26.435 DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
01:04:26.435 More info: https://sass-lang.com/d/legacy-js-api
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 1 │ [@import](/user/import) "@/assets/scss/uni.scss";
01:04:26.435   │         ^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 1:9  root stylesheet
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 2 │     [@import](/user/import) './uni_modules/vk-uview-ui/index.scss';
01:04:26.435   │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 2:10  root stylesheet
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 3 │     [@import](/user/import) './uni_modules/uv-ui-tools/index.scss';
01:04:26.435   │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 3:10  root stylesheet
01:04:26.451 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.451 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.451   ╷
01:04:26.451 1 │ [@import](/user/import) "../src/uni_modules/vk-uview-ui/theme.scss";
01:04:26.451   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.451   ╵
01:04:26.451     src\assets\scss\uni.scss 1:9  [@import](/user/import)
01:04:26.451     src\App.vue 1:9               root stylesheet
01:04:26.451 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.451 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.451   ╷
01:04:26.451 2 │ [@import](/user/import) '../src/uni_modules/uv-ui-tools/theme.scss';
01:04:26.451   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

操作步骤:

01:04:26.435 DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
01:04:26.435 More info: https://sass-lang.com/d/legacy-js-api
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 1 │ [@import](/user/import) "@/assets/scss/uni.scss";
01:04:26.435   │         ^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 1:9  root stylesheet
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 2 │     [@import](/user/import) './uni_modules/vk-uview-ui/index.scss';
01:04:26.435   │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 2:10  root stylesheet
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 3 │     [@import](/user/import) './uni_modules/uv-ui-tools/index.scss';
01:04:26.435   │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 3:10  root stylesheet
01:04:26.451 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.451 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.451   ╷
01:04:26.451 1 │ [@import](/user/import) "../src/uni_modules/vk-uview-ui/theme.scss";
01:04:26.451   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.451   ╵
01:04:26.451     src\assets\scss\uni.scss 1:9  [@import](/user/import)
01:04:26.451     src\App.vue 1:9               root stylesheet
01:04:26.451 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.451 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.451   ╷
01:04:26.451 2 │ [@import](/user/import) '../src/uni_modules/uv-ui-tools/theme.scss';
01:04:26.451   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

预期结果:

01:04:26.435 DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
01:04:26.435 More info: https://sass-lang.com/d/legacy-js-api
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 1 │ [@import](/user/import) "@/assets/scss/uni.scss";
01:04:26.435   │         ^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 1:9  root stylesheet
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 2 │     [@import](/user/import) './uni_modules/vk-uview-ui/index.scss';
01:04:26.435   │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 2:10  root stylesheet
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 3 │     [@import](/user/import) './uni_modules/uv-ui-tools/index.scss';
01:04:26.435   │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 3:10  root stylesheet
01:04:26.451 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.451 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.451   ╷
01:04:26.451 1 │ [@import](/user/import) "../src/uni_modules/vk-uview-ui/theme.scss";
01:04:26.451   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.451   ╵
01:04:26.451     src\assets\scss\uni.scss 1:9  [@import](/user/import)
01:04:26.451     src\App.vue 1:9               root stylesheet
01:04:26.451 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.451 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.451   ╷
01:04:26.451 2 │ [@import](/user/import) '../src/uni_modules/uv-ui-tools/theme.scss';
01:04:26.451   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

实际结果:

01:04:26.435 DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.
01:04:26.435 More info: https://sass-lang.com/d/legacy-js-api
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 1 │ [@import](/user/import) "@/assets/scss/uni.scss";
01:04:26.435   │         ^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 1:9  root stylesheet
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 2 │     [@import](/user/import) './uni_modules/vk-uview-ui/index.scss';
01:04:26.435   │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 2:10  root stylesheet
01:04:26.435 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.435 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.435   ╷
01:04:26.435 3 │     [@import](/user/import) './uni_modules/uv-ui-tools/index.scss';
01:04:26.435   │             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.435   ╵
01:04:26.435     src\App.vue 3:10  root stylesheet
01:04:26.451 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.451 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.451   ╷
01:04:26.451 1 │ [@import](/user/import) "../src/uni_modules/vk-uview-ui/theme.scss";
01:04:26.451   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
01:04:26.451   ╵
01:04:26.451     src\assets\scss\uni.scss 1:9  [@import](/user/import)
01:04:26.451     src\App.vue 1:9               root stylesheet
01:04:26.451 DEPRECATION WARNING: Sass [@import](/user/import) rules are deprecated and will be removed in Dart Sass 3.0.0.
01:04:26.451 More info and automated migrator: https://sass-lang.com/d/import
01:04:26.451   ╷
01:04:26.451 2 │ [@import](/user/import) '../src/uni_modules/uv-ui-tools/theme.scss';
01:04:26.451   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

更多关于uni-app DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

3 回复

有解决吗? 我scss版本是1.78 也没到1.8啊 更新了下hbuilder 就有这个报错了

更多关于uni-app DEPRECATION WARNING: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


解决了吗?我也有

针对您提到的 uni-app 中的 DEPRECATION WARNING 关于 Dart Sass 的旧版 JS API 即将被移除的问题,这里提供一个解决方案的示例,展示如何在项目中迁移至 Dart Sass 的新 API。由于 uni-app 本身不直接处理 Sass 编译,但通常会通过 Webpack 或类似的构建工具来集成 Sass 编译,以下示例将基于一个典型的构建配置进行调整。

步骤 1: 更新 package.json

首先,确保您的项目中安装了最新版本的 sasssass-loader。在 package.json 中更新这些依赖:

"dependencies": {
    "sass": "^1.43.0",  // 确保版本兼容 Dart Sass 1.x
    // 其他依赖...
},
"devDependencies": {
    "sass-loader": "^12.3.0",  // 确保版本与 Webpack 兼容
    // 其他开发依赖...
}

然后运行 npm installyarn 来更新依赖。

步骤 2: 修改 Webpack 配置

uni-app 项目中,Webpack 配置通常位于 vue.config.js 或自定义的 Webpack 配置文件中。您需要确保 sass-loader 使用 Dart Sass 而不是 Node Sass。由于 Dart Sass 已经是 sass 包的默认实现,通常不需要额外配置,但确认 sass-loader 的选项正确无误:

// vue.config.js 或 webpack.config.js
module.exports = {
    css: {
        loaderOptions: {
            sass: {
                // Dart Sass 不需要额外的 implementation 选项
                // 但可以配置其他 Sass 选项,如全局变量
                additionalData: `@import "@/styles/variables.scss";`
            }
        }
    },
    // 其他配置...
};

步骤 3: 迁移旧版 JS API

如果您的 Sass 文件或构建脚本中使用了 Dart Sass 的旧版 JS API(例如通过 node-sassrender 方法),您需要迁移到 Dart Sass 的新 API。以下是一个旧版 API 到新 API 的迁移示例:

旧版 API(Node Sass):

const sass = require('node-sass');
sass.render({file: 'input.scss'}, function(err, result) {
    if (!err) {
        console.log(result.css.toString());
    }
});

新版 API(Dart Sass):

const sass = require('sass');
sass.render({file: 'input.scss'}, function(err, result) {
    if (!err) {
        console.log(result.css.toString());
    }
});

注意,API 调用在 Dart Sass 中几乎保持不变,主要的变化在于依赖包的名称从 node-sass 变为 sass

通过以上步骤,您应该能够解决 DEPRECATION WARNING 并为 Dart Sass 2.0.0 的到来做好准备。如果 uni-app 项目中有特定的构建配置或插件处理 Sass,请根据实际情况调整上述步骤。

回到顶部