Sfoglia il codice sorgente

优化首屏加载:路由懒加载 + 清理死依赖

  路由由全量静态 import 改为按需懒加载(Login 保留同步以保证落地页即时呈现,
  其余 7 个页面拆分为独立 chunk),首屏不再下载全站代码;
  echarts/konva/视频播放器等重型库随之移入各页面按需块。
  首屏同步 JS 从约 3.3MB 降至约 1.1MB(gzip 后约 275KB,降幅约 65%)。

  同时关闭生产环境 source map(productionSourceMap: false),
  并移除全工程未引用的死依赖 three、echarts-gl、china-map-geojson。
画安 17 ore fa
parent
commit
614dcd810a
3 ha cambiato i file con 12 aggiunte e 11 eliminazioni
  1. 0 3
      package.json
  2. 11 8
      src/router/index.js
  3. 1 0
      vue.config.js

+ 0 - 3
package.json

@@ -10,14 +10,11 @@
   "dependencies": {
     "@amap/amap-jsapi-loader": "^1.0.1",
     "axios": "^1.13.6",
-    "china-map-geojson": "^1.0.4",
     "core-js": "^3.8.3",
     "echarts": "^5.6.0",
-    "echarts-gl": "^2.0.9",
     "element-ui": "^2.15.14",
     "konva": "^10.2.0",
     "swiper": "^5.4.5",
-    "three": "^0.183.1",
     "vue": "^2.6.14",
     "vue-awesome-swiper": "^4.1.1",
     "vue-router": "^3.6.5",

+ 11 - 8
src/router/index.js

@@ -1,14 +1,17 @@
 import Vue from "vue";
 import Router from "vue-router";
 
+// 登录页是首个落地页,同步加载以保证首屏即时呈现;
+// 其余页面按需懒加载,拆分为独立 chunk,避免首屏下载全站代码。
 import Login from "@/views/Login.vue";
-import Home from "@/views/Home.vue";
-import Main from "@/views/Main.vue";
-import StatusMonitoring from "@/views/StatusMonitoring.vue";
-import SpecialSituationMonitoring from "@/views/SpecialSituationMonitoring.vue";
-import DataAnalysis from "@/views/DataAnalysis.vue";
-import TrunkCoordination from "@/views/TrunkCoordination.vue";
-import NotFound from "@/views/NotFound.vue";
+
+const Main = () => import(/* webpackChunkName: "main" */ "@/views/Main.vue");
+const Home = () => import(/* webpackChunkName: "home" */ "@/views/Home.vue");
+const DataAnalysis = () => import(/* webpackChunkName: "watch" */ "@/views/DataAnalysis.vue");
+const StatusMonitoring = () => import(/* webpackChunkName: "surve" */ "@/views/StatusMonitoring.vue");
+const SpecialSituationMonitoring = () => import(/* webpackChunkName: "security" */ "@/views/SpecialSituationMonitoring.vue");
+const TrunkCoordination = () => import(/* webpackChunkName: "trunk" */ "@/views/TrunkCoordination.vue");
+const NotFound = () => import(/* webpackChunkName: "not-found" */ "@/views/NotFound.vue");
 
 Vue.use(Router);
 
@@ -25,4 +28,4 @@ export default new Router({
     { path: "/trunk", component: TrunkCoordination },
     { path: "*", component: NotFound },
   ]
-});
+});

+ 1 - 0
vue.config.js

@@ -5,6 +5,7 @@ const { defineConfig } = require('@vue/cli-service')
 const BRAND_TITLE = process.env.VUE_APP_BRAND_TITLE || '交通信号控制平台—灵•智'
 
 module.exports = defineConfig({
+  productionSourceMap: false,
   transpileDependencies: true,
   lintOnSave: false,
   chainWebpack: config => {