Bläddra i källkod

feat: 模块打包

lvkun996 2 år sedan
förälder
incheckning
7d025cb09d
6 ändrade filer med 363 tillägg och 296 borttagningar
  1. 34 0
      README.md
  2. 31 0
      build.js
  3. 1 0
      package.json
  4. 293 274
      src/router/index.ts
  5. 3 20
      src/store/router.ts
  6. 1 2
      vue.config.js

+ 34 - 0
README.md

@@ -23,3 +23,37 @@ request:
 | value | select的value |
 | key   | select的key   |
 
+
+
+## 打包
+
+###  build
+
+npm run build 该指令全是将目前已有的模块全部打包
+
+### package
+
+npm run build:package  该指令全是将目前已有的模块分别打包
+
+目前已有的模块
+
+|          | 名称     | 链接                                     |
+| -------- | -------- | ---------------------------------------- |
+| iot      | 物联网   | /iot                                     |
+| rts      | 视联网   | /rts                                     |
+| schedule | 数据中台 | http://124.222.113.37:12345/scheduler/ui |
+| view     | 可视化   | http://cloudview.jiaolongcloud.com/      |
+| lowcode  | 低代码   | http://49.232.161.110:5556               |
+
+#### 使用说明
+
+当运行 npm run build:package iot rts 时 , 将会打包`物联网`与`视联网`两个模块
+
+当运行 npm run build:package rts 时 , 将会打包`视联网`模块
+
+当运行 npm run build:package schedule view 时 ,将会打包`数据中台`与`可视化`两个模块
+
+当模块的链接是外部链接时,如果打包的模块在参数的首位,则打包后会自动跳转到外部链接
+
+
+

+ 31 - 0
build.js

@@ -0,0 +1,31 @@
+const fs = require('fs')
+const { exec } = require('child_process')
+const { resolve } = require('path')
+
+const args = process.argv.slice(2)
+
+console.log()
+
+console.log('读取脚本参数中 🤬')
+
+const file = fs.readFileSync(resolve(__dirname, 'src/router/index.ts'), 'utf8')
+
+const r = file.replace(
+  'const _routes = [iot, rts, schedule, view, lowcode]',
+  `const _routes = [${args.map((arg, index) => index > 0 ? ` ${arg}` : arg)}]`
+)
+
+console.log('修改路由值成功 🌹')
+
+fs.writeFileSync(resolve(__dirname, 'src/router/index.ts'), r, 'utf-8')
+
+console.log('开始打包  📦')
+console.log('打包中...... 💪')
+exec('npm run build', (error, stdout, stderr) => {
+  if (error) {
+    console.error(`执行脚本时出错:${error}`)
+    fs.writeFileSync(resolve(__dirname, 'src/router/index.ts'), file, 'utf-8')
+  }
+  console.log('打包成功 🎉')
+  fs.writeFileSync(resolve(__dirname, 'src/router/index.ts'), file, 'utf-8')
+})

+ 1 - 0
package.json

@@ -5,6 +5,7 @@
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
+    "build:package": "node build.js",
     "start": "yarn run serve",
     "lint": "vue-cli-service lint"
   },

+ 293 - 274
src/router/index.ts

@@ -1,285 +1,304 @@
 import { createRouter, createWebHistory } from 'vue-router'
 
-export const routes: Array<ROUTER.RoutesProps> = [
-  {
-    path: '/',
-    name: '物联网',
-    meta: {
-      title: '物联网'
-    },
-    component: () => import('@/layout/layout.vue'),
-    redirect: '/dashboard',
-    children: [
-      {
-        path: '/dashboard',
-        name: '首页',
-        icon: 'DashboardOutlined',
-        component: () => import('@/pages/iot/dashboard/deviceAccess/index.vue')
-      },
-      {
-        path: '/product',
-        name: '产品',
-        redirect: '/product/index',
-        icon: 'AppstoreOutlined',
-        children: [
-          {
-            path: '/product/index',
-            name: '产品模型',
-            component: () => import('@/pages/iot/model/index.vue')
-          },
-          {
-            path: '/product/models',
-            name: '产品模型库',
-            component: () => import('@/pages/iot/model/models.vue')
-          },
-          {
-            path: '/product/detail',
-            name: '产品模型详情',
-            hidden: true,
-            component: () => import('@/pages/iot/model/detail.vue')
-          }
-        ]
-      },
-      {
-        path: '/device',
-        name: '设备',
-        redirect: '/device/index',
-        icon: 'RobotOutlined',
-        children: [
-          {
-            path: '/device/index',
-            name: '所有设备',
-            component: () => import('@/pages/iot/device/index.vue')
-          },
-          {
-            path: '/device/detail',
-            name: '设备详情',
-            hidden: true,
-            component: () => import('@/pages/iot/device/detail.vue')
-          },
-          {
-            path: '/device/group',
-            name: '设备群组',
-            component: () => import('@/pages/iot/device/group.vue')
-          },
-          {
-            path: '/device/topology',
-            name: '设备拓扑 ',
-            component: () => import('@/pages/iot/device/topology.vue')
-          }
-        ]
-      },
-      {
-        path: '/rule',
-        name: '规则',
-        redirect: '/rule/forward',
-        icon: 'AimOutlined',
-        children: [
-          {
-            path: '/rule/forward',
-            name: '转发规则',
-            component: () => import('@/pages/iot/rule/forwardRule.vue')
-          },
-          {
-            path: '/rule/link',
-            name: '联动规则',
-            component: () => import('@/pages/iot/rule/linkRules.vue')
-          }
-        ]
-      },
-      {
-        path: '/devOps',
-        name: '监控运维',
-        redirect: '/devOps/report',
-        icon: 'CodeOutlined',
-        children: [
-          {
-            path: '/devOps/report',
-            name: '数据监控',
-            component: () => import('@/pages/iot/devOps/statistReport.vue')
-          },
-          {
-            path: '/devOps/onlineTest',
-            name: '在线调试',
-            component: () => import('@/pages/iot/devOps/onlineTest.vue')
-          },
-          {
-            path: '/devOps/mt',
-            name: '消息追踪',
-            component: () => import('@/pages/iot/devOps/msgTracking.vue')
-          },
-          {
-            path: '/devOps/nowAlert',
-            name: '当前告警',
-            component: () => import('@/pages/iot/devOps/nowAlert.vue')
-          },
-          {
-            path: '/devOps/nowNotice',
-            name: '当前提醒',
-            component: () => import('@/pages/iot/devOps/nowNotice.vue')
-          }
-        ]
-      },
-      {
-        path: '/dataServer',
-        name: '数据服务',
-        redirect: '/dataServer/history',
-        icon: 'DatabaseOutlined',
-        children: [
-          {
-            path: '/dataServer/history',
-            name: '历史数据',
-            component: () => import('@/pages/iot/dataServer/history.vue')
-          },
-          {
-            path: '/dataServer/openApi',
-            name: '开放接口',
-            component: () => import('@/pages/iot/dataServer/openApi.vue')
-          }
-        ]
-      },
-      {
-        path: '/task',
-        name: '任务中心',
-        redirect: '/task/manage',
-        // <container-outlined />
-        icon: 'ContainerOutlined',
-        children: [
-          {
-            path: '/task/manage',
-            name: '任务管理',
-            component: () => import('@/pages/iot/task/manage.vue')
-          },
-          {
-            path: '/task/track',
-            name: '任务追踪',
-            component: () => import('@/pages/iot/task/track.vue')
-          }
-        ]
-      },
-      {
-        path: '/sys',
-        name: '系统设置',
-        redirect: '/sys/noticeway',
-        icon: 'DatabaseOutlined',
-        children: [
-          {
-            path: '/sys/noticeway',
-            name: '通知方式',
-            component: () => import('@/pages/iot/sys/noticeway.vue')
-          },
-          {
-            path: '/sys/notice',
-            name: '通知设置',
-            component: () => import('@/pages/iot/sys/notice.vue')
-          }
-        ]
-      },
-      {
-        path: '/deviceDoc',
-        name: '设备接入文档',
-        component: () => import('@/pages/iot/doc/deviceDoc.vue'),
-        icon: 'BookOutlined'
-      },
-      {
-        path: '/dataDoc',
-        name: '数据服务文档',
-        component: () => import('@/pages/iot/doc/dataDoc.vue'),
-        icon: 'CoffeeOutlined'
-      }
-    ]
+const iot = {
+  path: '/iot',
+  name: '物联网',
+  meta: {
+    title: '物联网'
   },
-  {
-    path: '/rts',
-    name: '视联网',
-    meta: {
-      title: '视联网'
+  component: () => import('@/layout/layout.vue'),
+  redirect: '/dashboard',
+  children: [
+    {
+      path: '/dashboard',
+      name: '首页',
+      icon: 'DashboardOutlined',
+      component: () => import('@/pages/iot/dashboard/deviceAccess/index.vue')
     },
-    component: () => import('@/layout/layout.vue'),
-    redirect: '/stream',
-    children: [
-      {
-        path: '/stream',
-        name: '视频流管理',
-        icon: 'PlayCircleOutlined',
-        component: () => import('@/pages/rts/stream/index.vue')
-      },
-      {
-        path: '/pull',
-        name: '拉流管理',
-        icon: 'FallOutlined',
-        component: () => import('@/pages/rts/pull/index.vue')
-      },
-      {
-        path: '/push',
-        name: '推流管理',
-        icon: 'RiseOutlined',
-        component: () => import('@/pages/rts/push/index.vue')
-      },
-      {
-        path: '/record',
-        name: '存储配置',
-        icon: 'FileAddOutlined',
-        component: () => import('@/pages/rts/record/index.vue')
-      },
-      {
-        path: '/gb28181',
-        name: '国标设备',
-        icon: 'CameraOutlined',
-        redirect: '/gb28181/index',
-        children: [
-          {
-            path: '/gb28181/index',
-            name: '所有国标设备',
-            component: () => import('@/pages/rts/gb28181/index.vue')
-          },
-          {
-            path: '/gb28181/record',
-            name: '设备录像',
-            hidden: true,
-            component: () => import('@/pages/rts/gb28181/record.vue')
-          }
-        ]
-      },
-      {
-        path: '/protocol',
-        name: '协议配置',
-        icon: 'DeploymentUnitOutlined',
-        component: () => import('@/pages/rts/protocol/index.vue')
-      },
-      {
-        path: '/monitor',
-        name: '系统监控',
-        icon: 'ProfileOutlined',
-        component: () => import('@/pages/rts/monitor/index.vue')
-      }
-    ]
-  },
-  {
-    path: 'http://124.222.113.37:12345/scheduler/ui',
-    name: '数据中台',
-    meta: {
-      title: '数据中台'
+    {
+      path: '/product',
+      name: '产品',
+      redirect: '/product/index',
+      icon: 'AppstoreOutlined',
+      children: [
+        {
+          path: '/product/index',
+          name: '产品模型',
+          component: () => import('@/pages/iot/model/index.vue')
+        },
+        {
+          path: '/product/models',
+          name: '产品模型库',
+          component: () => import('@/pages/iot/model/models.vue')
+        },
+        {
+          path: '/product/detail',
+          name: '产品模型详情',
+          hidden: true,
+          component: () => import('@/pages/iot/model/detail.vue')
+        }
+      ]
     },
-    link: true
-  },
-  {
-    path: 'http://cloudview.jiaolongcloud.com/',
-    name: '可视化',
-    meta: {
-      title: '可视化'
+    {
+      path: '/device',
+      name: '设备',
+      redirect: '/device/index',
+      icon: 'RobotOutlined',
+      children: [
+        {
+          path: '/device/index',
+          name: '所有设备',
+          component: () => import('@/pages/iot/device/index.vue')
+        },
+        {
+          path: '/device/detail',
+          name: '设备详情',
+          hidden: true,
+          component: () => import('@/pages/iot/device/detail.vue')
+        },
+        {
+          path: '/device/group',
+          name: '设备群组',
+          component: () => import('@/pages/iot/device/group.vue')
+        },
+        {
+          path: '/device/topology',
+          name: '设备拓扑 ',
+          component: () => import('@/pages/iot/device/topology.vue')
+        }
+      ]
+    },
+    {
+      path: '/rule',
+      name: '规则',
+      redirect: '/rule/forward',
+      icon: 'AimOutlined',
+      children: [
+        {
+          path: '/rule/forward',
+          name: '转发规则',
+          component: () => import('@/pages/iot/rule/forwardRule.vue')
+        },
+        {
+          path: '/rule/link',
+          name: '联动规则',
+          component: () => import('@/pages/iot/rule/linkRules.vue')
+        }
+      ]
+    },
+    {
+      path: '/devOps',
+      name: '监控运维',
+      redirect: '/devOps/report',
+      icon: 'CodeOutlined',
+      children: [
+        {
+          path: '/devOps/report',
+          name: '数据监控',
+          component: () => import('@/pages/iot/devOps/statistReport.vue')
+        },
+        {
+          path: '/devOps/onlineTest',
+          name: '在线调试',
+          component: () => import('@/pages/iot/devOps/onlineTest.vue')
+        },
+        {
+          path: '/devOps/mt',
+          name: '消息追踪',
+          component: () => import('@/pages/iot/devOps/msgTracking.vue')
+        },
+        {
+          path: '/devOps/nowAlert',
+          name: '当前告警',
+          component: () => import('@/pages/iot/devOps/nowAlert.vue')
+        },
+        {
+          path: '/devOps/nowNotice',
+          name: '当前提醒',
+          component: () => import('@/pages/iot/devOps/nowNotice.vue')
+        }
+      ]
     },
-    link: true
+    {
+      path: '/dataServer',
+      name: '数据服务',
+      redirect: '/dataServer/history',
+      icon: 'DatabaseOutlined',
+      children: [
+        {
+          path: '/dataServer/history',
+          name: '历史数据',
+          component: () => import('@/pages/iot/dataServer/history.vue')
+        },
+        {
+          path: '/dataServer/openApi',
+          name: '开放接口',
+          component: () => import('@/pages/iot/dataServer/openApi.vue')
+        }
+      ]
+    },
+    {
+      path: '/task',
+      name: '任务中心',
+      redirect: '/task/manage',
+      // <container-outlined />
+      icon: 'ContainerOutlined',
+      children: [
+        {
+          path: '/task/manage',
+          name: '任务管理',
+          component: () => import('@/pages/iot/task/manage.vue')
+        },
+        {
+          path: '/task/track',
+          name: '任务追踪',
+          component: () => import('@/pages/iot/task/track.vue')
+        }
+      ]
+    },
+    {
+      path: '/sys',
+      name: '系统设置',
+      redirect: '/sys/noticeway',
+      icon: 'DatabaseOutlined',
+      children: [
+        {
+          path: '/sys/noticeway',
+          name: '通知方式',
+          component: () => import('@/pages/iot/sys/noticeway.vue')
+        },
+        {
+          path: '/sys/notice',
+          name: '通知设置',
+          component: () => import('@/pages/iot/sys/notice.vue')
+        }
+      ]
+    },
+    {
+      path: '/deviceDoc',
+      name: '设备接入文档',
+      component: () => import('@/pages/iot/doc/deviceDoc.vue'),
+      icon: 'BookOutlined'
+    },
+    {
+      path: '/dataDoc',
+      name: '数据服务文档',
+      component: () => import('@/pages/iot/doc/dataDoc.vue'),
+      icon: 'CoffeeOutlined'
+    }
+  ]
+}
+
+const rts = {
+  path: '/rts',
+  name: '视联网',
+  meta: {
+    title: '视联网'
   },
-  {
-    path: 'http://49.232.161.110:5556',
-    name: '低代码',
-    meta: {
-      title: '低代码'
+  component: () => import('@/layout/layout.vue'),
+  redirect: '/stream',
+  children: [
+    {
+      path: '/stream',
+      name: '视频流管理',
+      icon: 'PlayCircleOutlined',
+      component: () => import('@/pages/rts/stream/index.vue')
     },
-    link: true
-  }
-]
+    {
+      path: '/pull',
+      name: '拉流管理',
+      icon: 'FallOutlined',
+      component: () => import('@/pages/rts/pull/index.vue')
+    },
+    {
+      path: '/push',
+      name: '推流管理',
+      icon: 'RiseOutlined',
+      component: () => import('@/pages/rts/push/index.vue')
+    },
+    {
+      path: '/record',
+      name: '存储配置',
+      icon: 'FileAddOutlined',
+      component: () => import('@/pages/rts/record/index.vue')
+    },
+    {
+      path: '/gb28181',
+      name: '国标设备',
+      icon: 'CameraOutlined',
+      redirect: '/gb28181/index',
+      children: [
+        {
+          path: '/gb28181/index',
+          name: '所有国标设备',
+          component: () => import('@/pages/rts/gb28181/index.vue')
+        },
+        {
+          path: '/gb28181/record',
+          name: '设备录像',
+          hidden: true,
+          component: () => import('@/pages/rts/gb28181/record.vue')
+        }
+      ]
+    },
+    {
+      path: '/protocol',
+      name: '协议配置',
+      icon: 'DeploymentUnitOutlined',
+      component: () => import('@/pages/rts/protocol/index.vue')
+    },
+    {
+      path: '/monitor',
+      name: '系统监控',
+      icon: 'ProfileOutlined',
+      component: () => import('@/pages/rts/monitor/index.vue')
+    }
+  ]
+}
+
+const schedule = {
+  path: 'http://124.222.113.37:12345/scheduler/ui',
+  name: '数据中台',
+  meta: {
+    title: '数据中台'
+  },
+  link: true
+}
+
+const view = {
+  path: 'http://cloudview.jiaolongcloud.com/',
+  name: '可视化',
+  meta: {
+    title: '可视化'
+  },
+  link: true
+}
+
+const lowcode = {
+  path: 'http://49.232.161.110:5556',
+  name: '低代码',
+  meta: {
+    title: '低代码'
+  },
+  link: true
+}
+
+const _routes = [iot, rts, schedule, view, lowcode] as any
+
+if (_routes[0].link) {
+  window.open(_routes[0].path)
+}
+
+const redirectRoutes = {
+  path: '/',
+  name: '',
+  meta: {
+    title: ''
+  },
+  redirect: _routes[0].redirect
+}
+
+export const routes: Array<ROUTER.RoutesProps> = [redirectRoutes, ..._routes]
 
 const router = createRouter({
   history: createWebHistory(process.env.BASE_URL),

+ 3 - 20
src/store/router.ts

@@ -1,21 +1,7 @@
 import { defineStore } from 'pinia'
 import { ConstantStore } from '@/enum/store'
-import { ref, computed, onMounted, watch, reactive, watchEffect } from 'vue'
+import { reactive } from 'vue'
 import RootRouter from '@/router'
-import { useSessionStorageState } from 'vue-hooks-plus'
-import { AppRouter as AppRouterEnum, Emitter } from '@/enum'
-import { useEmitter } from '@/hooks/index'
-import { useRoute } from 'vue-router'
-
-/**
- * 1. 获取当前路由path
- * 2. 从缓存中获取router, 防止刷新都丢失状态
- * 3. 获取navbar路由list
- *  3.1 根据当前的路由path 反推到最顶级父元素 将其置为常亮
- * 4. 每次点击navbar的路由的时候,将对应的sider第一项展开
- */
-
-const emitter = useEmitter()
 
 const initAppRouterState: ROUTER.RouterRecords = {
   navbar: {
@@ -30,6 +16,7 @@ const initAppRouterState: ROUTER.RouterRecords = {
 }
 export const useAppRouter = defineStore(ConstantStore.ROUTER, () => {
   const appRouter = reactive<ROUTER.RouterRecords>(initAppRouterState)
+  console.log('RootRouter.options.routes:', RootRouter.options.routes)
 
   const initAppRouter = () => {
     appRouter.navbar.route = RootRouter.options.routes.map((route: any) => {
@@ -41,11 +28,7 @@ export const useAppRouter = defineStore(ConstantStore.ROUTER, () => {
       }
     })
 
-    appRouter.sider.route = RootRouter.options.routes[0].children!
-  }
-
-  const changeNavbar = (path: string) => {
-    RootRouter.push(path)
+    appRouter.sider.route = RootRouter.options.routes[1].children!
   }
 
   if (appRouter.navbar.route.length === 0) {

+ 1 - 2
vue.config.js

@@ -1,10 +1,9 @@
-
 const { defineConfig } = require('@vue/cli-service')
 const proxy = require('./config/proxy.ts')
 const path = require('path')
 
 module.exports = defineConfig({
-  // publicPath: '/',
+  publicPath: '/',
   transpileDependencies: true,
   devServer: {
     proxy: proxy.dev