feat:白屏问题

babel.config.js

@@ -0,0 +1,16 @@
+module.exports = {
+  presets: [
+    [
+      '@vue/cli-plugin-babel/preset',
+      {
+        useBuiltIns: 'usage',
+        corejs: 3,
+        targets: {
+          chrome: '49',
+          ios: '10',
+          android: '4.4'
+        }
+      }
+    ]
+  ]
+};

package.json

@@ -19,12 +19,14 @@
   "dependencies": {
     "@element-plus/icons-vue": "^2.3.1",
     "axios": "^1.8.2",
+    "core-js": "^3.41.0",
     "cos-js-sdk-v5": "^1.8.7",
     "dotenv": "^16.4.7",
     "element-plus": "^2.7.8",
     "js-base64": "^3.7.7",
     "lodash": "^4.17.21",
     "pinia": "^2.1.7",
+    "regenerator-runtime": "^0.14.1",
     "shrinkpng": "^1.2.0-beta.1",
     "sortablejs": "^1.15.6",
     "uuid": "^11.1.0",
@@ -37,15 +39,20 @@
     "vuex": "^4.1.0"
   },
   "devDependencies": {
+    "@babel/core": "^7.26.10",
+    "@babel/polyfill": "^7.12.1",
+    "@babel/preset-env": "^7.26.9",
     "@tsconfig/node20": "^20.1.4",
     "@types/node": "^20.14.5",
     "@types/postcss-pxtorem": "^6.1.0",
+    "@types/webpack-env": "^1.18.8",
     "@vant/auto-import-resolver": "^1.3.0",
     "@vitejs/plugin-vue": "^5.0.5",
     "@vitejs/plugin-vue-jsx": "^4.0.0",
     "@vue/tsconfig": "^0.5.1",
     "@yl/yili-fe-lint-config": "^1.0.0",
     "amfe-flexible": "^2.2.1",
+    "babel-loader": "^10.0.0",
     "husky": "^9.1.5",
     "npm-run-all2": "^6.2.0",
     "postcss-pxtorem": "^6.1.0",
@@ -56,5 +63,12 @@
     "unplugin-vue-components": "^0.27.5",
     "vite": "^5.3.1",
     "vue-tsc": "^2.0.21"
-  }
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not dead",
+    "Android >= 4.4",
+    "iOS >= 8"
+  ]
 }

src/main.ts

@@ -1,4 +1,6 @@
 import 'amfe-flexible';
+import 'core-js/stable';
+import 'regenerator-runtime/runtime';
 import { createApp } from 'vue';
 import { createPinia } from 'pinia';
 import App from './App.vue';

src/views/Home/Index.vue

@@ -10,31 +10,27 @@ const contentShow = ref(false);
 const show = ref(false);
 
 onMounted(async () => {
-  if (utils.getSessionStorage('xToken')) {
+  const appToken = utils.getSessionStorage('xToken');
-    const appToken = utils.getSessionStorage('xToken');
+  getUserInfo(appToken)
-    getUserInfo(appToken)
+    .then((res) => {
-      .then((res) => {
+      if (res.data) {
-        if (res.data) {
+        contentShow.value = true;
-          contentShow.value = true;
+        const token = res.data.data.token;
-          const token = res.data.data.token;
+        localStorage.setItem('plantToken', token);
-          localStorage.setItem('plantToken', token);
+        utils.setSessionStorage('userInfo', res.data.data);
-          utils.setSessionStorage('userInfo', res.data.data);
+      } else {
-        } else {
-          contentShow.value = false;
-          showFailToast(
-            error.response.data?.message || error.data?.message || error.message || '服务器错误'
-          );
-        }
-      })
-      .catch((error) => {
         contentShow.value = false;
-        showFailToast(error?.response?.data?.message || error?.message || '服务器错误');
+        showFailToast(
-      });
+          error.response.data?.message || error.data?.message || error.message || '服务器错误'
-  } else {
+        );
-    contentShow.value = true;
+      }
-  }
+    })
+    .catch((error) => {
+      contentShow.value = false;
+      showFailToast(error?.response?.data?.message || error?.message || '服务器错误');
+    });
 });
-function create() {
+function create () {
   show.value = true;
 }
 </script>

tsconfig.app.json

@@ -15,6 +15,10 @@
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
     "allowJs": true,
     "baseUrl": ".",
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
     "paths": {
       "@/*": ["./src/*"]
     }

tsconfig.json

@@ -9,6 +9,10 @@
     }
   ],
   "compilerOptions": {
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
     "types": ["element-plus/global"]
   }
 }

vite.config.ts

@@ -60,6 +60,16 @@ export default defineConfig(({ mode }) => {
       alias: {
         '@': fileURLToPath(new URL('./src', import.meta.url))
       }
+    },
+    build: {
+      target: ['es2015', 'chrome49', 'edge79', 'firefox68', 'safari11.1'],
+      minify: 'terser',
+      terserOptions: {
+        compress: {
+          drop_console: true,
+          drop_debugger: true
+        }
+      }
     }
   };
 });