fix: sass warn

Author: ATQQ

packages/theme/CHANGELOG.md

@@ -5,7 +5,7 @@
 ### Patch Changes
 
 - chore: update dependencies
-- fix: sass warn
+- fix: sass warn - [legacy-js-api](https://sass-lang.com/documentation/breaking-changes/legacy-js-api/)
 
 ## 0.5.1
 

packages/theme/docs/changelog.md

@@ -32,7 +32,7 @@ bun install vitepress@latest
 ### Patch Changes
 
 - chore: update dependencies
-- fix: sass warn
+- fix: sass warn - [legacy-js-api](https://sass-lang.com/documentation/breaking-changes/legacy-js-api/)
 
 ## 0.5.1 (2024/10/21)
 

packages/theme/docs/example/BlogExample.vue

@@ -68,7 +68,7 @@ function handleUpdatePageNum(current: number) {
 </template>
 
 <style lang="scss" scoped>
-@import './style.scss';
+@use './style.scss';
 
 .el-pagination-wrapper {
   :deep(.el-pagination li.is-active.number) {

packages/theme/package.json

@@ -72,7 +72,7 @@
     "artalk": "^2.8.5",
     "element-plus": "^2.7.2",
     "pagefind": "^1.2.0",
-    "sass": "^1.77.8",
+    "sass": "^1.80.6",
     "typescript": "^5.4.5",
     "vite": "^5.4.9",
     "vitepress": "1.5.0",

packages/theme/src/node.ts

@@ -23,7 +23,16 @@ export function getThemeConfig(cfg: Partial<Theme.BlogConfig> = {}) {
   // 文章数据
   const pagesData: Theme.PageData[] = []
   const extraVPConfig: any = {
-    vite: {}
+    vite: {
+      // see https://sass-lang.com/documentation/breaking-changes/legacy-js-api/
+      css: {
+        preprocessorOptions: {
+          scss: {
+            api: 'modern',
+          },
+        },
+      },
+    },
   }
 
   // 获取要加载的vite插件

packages/theme/src/utils/node/vitePlugins.ts

@@ -64,7 +64,8 @@ export function getVitePlugins(cfg: Partial<Theme.BlogConfig> = {}) {
 
 export function registerVitePlugins(vpCfg: any, plugins: any[]) {
   vpCfg.vite = {
-    plugins
+    plugins,
+    ...vpCfg.vite,
   }
 }