refactor(theme-chalk): update Sass functions to prep for 3.0.0

[wjp980108]

Replaced deprecated global built-in functions with the recommended alternatives to avoid future issues when upgrading to Dart Sass 3.0.0. This change ensures compatibility with newer versions and removes the warning messages.

Please make sure these boxes are checked before submitting your PR, thank you!

• [x] Make sure you follow contributing guide English | (中文 | Español | Français).
• [x] Make sure you are merging your commits to dev branch.
• [x] Add some descriptions and refer to relative issues for your PR.

[pull-request-triage[bot]]

👋 @wjp980108, thank you for contributing element-plus.

• You can comment with /label Components:[component_name] to add a label for which component you are working on.
• You may join our for staying tuned.

[github-actions[bot]]

Hello @wjp980108, thank you for contributing to element-plus, please see our guideline to see how to make contribution

[github-actions[bot]]

[pkg-pr-new[bot]]

Open in Stackblitz

pnpm add https://pkg.pr.new/element-plus/element-plus@18579

commit: f86252f

[github-actions[bot]]

🧪 Playground Preview: https://element-plus.run/?pr=18579 Please comment the example via this playground if needed.

[wjp980108]

Can you tell me which sass version you are using?

1.80.0

[moulib-narayana]

@wjp980108

Still this issue being shown.

Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0. Use color.mix instead.

[wjp980108]

@wjp980108

Still this issue being shown.

Global built-in functions are deprecated and will be removed in Dart Sass 3.0.0. Use color.mix instead.

Is this a local project?

[moulib-narayana]

@wjp980108

This is my deployed project but the snapshots are from locally run project.

And I found a temporary fix to silence the warings: I added the below code snippet in nuxt.config.ts and the element plus warnings were silenced during the runtime and build time.

vite: {
      css: {
         preprocessorOptions: {
            scss: {
               api: "modern-compiler",
               // TODO: After SASS warnings fixed in element plus, remove this line.
               quietDeps: true, // Silence deprecation warnings from dependencies
            },
         },
      },
   },

[k713927]

I didn't pay attention to see someone submitted，but I found that packages/theme-chalk/src/color/index.scss file also has expired warming , in my pr ：https://github.com/element-plus/element-plus/pull/18627

[wjp980108]

@wjp980108

这是我部署的项目，但快照来自本地运行的项目。

我找到了一个临时的解决方案来消除警告： 我添加了下面的代码片段nuxt.config.ts，并且在运行和构建期间元素和警告都被消除了。

vite: {
      css: {
         preprocessorOptions: {
            scss: {
               api: "modern-compiler",
               // TODO: After SASS warnings fixed in element plus, remove this line.
               quietDeps: true, // Silence deprecation warnings from dependencies
            },
         },
      },
   },

quietDeps

I tried it for a while, and it has no effect. Let's wait for the version. Anyway, it has no effect on the project anyway

[wjp980108]

I didn't pay attention to see someone submitted，but I found that packages/theme-chalk/src/color/index.scss file also has expired warming , in my pr ：#18627

It should be packages/theme-chalk/src/mixins/mixins.scss Because I was handled by a warning at runtime, I did not find that the file was found

[k713927]

I didn't pay attention to see someone submitted，but I found that packages/theme-chalk/src/color/index.scss file also has expired warming , in my pr ：#18627

It should be packages/theme-chalk/src/mixins/mixins.scss Because I was handled by a warning at runtime, I did not find that the file was found

yes, is this file packages/theme-chalk/src/mixins/mixins.scss，I wrote it wrong

[wjp980108]

I didn't pay attention to see someone submitted，but I found that packages/theme-chalk/src/color/index.scss file also has expired warming , in my pr ：#18627

It should be packages/theme-chalk/src/mixins/mixins.scss Because I was handled by a warning at runtime, I did not find that the file was found

yes, is this file packages/theme-chalk/src/mixins/mixins.scss，I wrote it wrong

Thank you for reminding, have been repaired, wait for the release