图像识别页面优化

src/assets/styles/variable.scss

@@ -1,4 +1,8 @@
+
+
+@use "sass:math";
 $vw_base: 750; //设计稿宽度
 @function vw($px) {
-	@return ($px / $vw_base) * 100vw;
+	// @return ($px / $vw_base) * 100vw;
+	@return (math.div( $px , $vw_base ))*100vw;
 }

vue.config.js

@@ -48,16 +48,10 @@ module.exports = {
   css: {
     loaderOptions: {
       sass: {
-        //注意：sass-loader将文件引用写入每个组件，适合全局引入变量，但不适合在单页面应用中添加样式，如果是全局样式（非变量），建议在main.js里引入
-        // 路径支持别名的写法，案例就是用了路径别名，如果你没有在项目里设置，也可以自己手动设置即可
-        // sass-loader v10以下老版本 用的是prependData，不是additionalData
-        // 给 sass-loader 传递选项
-        // 默认情况下 `sass` 选项会同时对 `sass` 和 `scss` 语法同时生效
-        // 因为 `scss` 语法在内部也是由 sass-loader 处理的
-        // 但是在配置 `data` 选项的时候
-        // `scss` 语法会要求语句结尾必须有分号，`sass` 则要求必须没有分号
-        // 在这种情况下，我们可以使用 `scss` 选项，对 `scss` 语法进行单独配置
-        additionalData: `@import "@/assets/styles/variable.scss";`,
+        // 使用 Dart Sass 配置
+        implementation: require('sass'),
+        // 更新为 additionalData 语法
+        additionalData: `@use "@/assets/styles/variable.scss" as *;`,
       },
     },
   },