图库列表样式修改、scss问题兼容

src/views/report/Classify.vue

@@ -268,7 +268,7 @@ onUnmounted(() => {
   </div>
 </template>
 <style scoped lang="scss">
-@import './css/index.scss';
+@use './css/index.scss';
 .report-index-page {
   position: relative;
 

src/views/report/Detail.vue

@@ -362,7 +362,7 @@ onUnmounted(() => {
   ></t-back-top>
 </template>
 <style scoped lang="scss">
-@import './css/index.scss';
+@use './css/index.scss';
 .top-nav-wrap {
     position: fixed;
     top: 70px;

src/views/report/Index.vue

@@ -195,7 +195,7 @@ onUnmounted(() => {
   </div>
 </template>
 <style scoped lang="scss">
-@import './css/index.scss';
+@use './css/index.scss';
 .report-index-page {
   position: relative;
 

src/views/report/PosterDetail.vue

@@ -61,7 +61,7 @@ onUnmounted(() => {
   ></t-back-top>
 </template>
 <style scoped lang="scss">
-@import './css/index.scss';
+@use './css/index.scss';
 .top-nav-wrap {
     position: fixed;
     top: 70px;

src/views/report/Search.vue

@@ -180,7 +180,7 @@ onUnmounted(() => {
   </div>
 </template>
 <style scoped lang="scss">
-@import './css/index.scss';
+@use './css/index.scss';
 .report-index-page {
   position: relative;
 

src/views/report/components/RightSlideWrap.vue

@@ -61,7 +61,7 @@ function handleToBanner() {
   </div>
 </template>
 <style scoped lang="scss">
-@import '../css/index.scss';
+@use '../css/index.scss';
 .right-aside-box{
     .recommand-banner {
       width: 420px;

vite.config.js

@@ -76,7 +76,8 @@ export default defineConfig(({ mode }) => {
         scss: {
           // 定义全局的scss变量
           // 给导入的路径最后加上 ;
-          additionalData: `@import '@/styles/var.scss';`,
+          additionalData: `@use '@/styles/var.scss';`,
+          api: 'modern-compiler', // or "modern", "legacy"
         },
       },
     },