Home Explore Help
Register Sign In
caner
/
vue-vite-ts
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

增加动态路由配置
Signed-off-by: Caner <5658514@qq.com>

Caner 3 years ago
parent
5fc4237c1f
commit
37a66b62ac
16 changed files with 91 additions and 46 deletions
Unified View Show Diff Stats
  1. 20 10
      README.md
  2. 0 1
      index.html
  3. 1 0
      package.json
  4. 11 2
      src/pages/admin/main.ts
  5. 0 13
      src/pages/admin/router/index.ts
  6. 0 0
      src/pages/admin/views/home/index.vue
  7. 10 0
      src/pages/admin/views/home/route.ts
  8. 3 0
      src/pages/admin/views/test/index.vue
  9. 11 0
      src/pages/admin/views/test/route.ts
  10. 3 0
      src/pages/index/assets/js/interfacePublic.ts
  11. 8 1
      src/pages/index/main.ts
  12. 0 19
      src/pages/index/router/index.ts
  13. 0 0
      src/pages/index/views/home/index.vue
  14. 10 0
      src/pages/index/views/home/route.ts
  15. 3 0
      src/pages/index/views/test/index.vue
  16. 11 0
      src/pages/index/views/test/route.ts

+ 20 - 10
README.md
View File 

@@ -1,5 +1,10 @@
 
 # vue3+TS+Eslint 多入口模板
 
 # vue3+TS+Eslint 多入口模板
 
 ```
 
 ```
 
+框架默认采用vite+vue3+TS+Eslint
 
+```
 
+
 
+## 注意
 
+```
 
 1. 默认安装:
 
 1. 默认安装:
 
    1. aixos
 
    1. aixos
 
    2. js-md5
 
    2. js-md5
 
@@ -9,31 +14,40 @@
 
    6. naive-ui 
    6. naive-ui 
 2. 子页面全局interface文件/pages/*/assets/js/interfacePublic.ts
 
 2. 子页面全局interface文件/pages/*/assets/js/interfacePublic.ts
 
 3. 注意pinia 注册ID唯一性
 
 3. 注意pinia 注册ID唯一性
 
+4. 子页面全局ui组件引用 /pages/*/assets/js/nativeUiPluginPublic.ts
 
+5. 本项目配置全局动态路由（各子页面单独添加route.ts）参考/pages/index/views/*/route.ts
 
+6. 多入口无法同时使用web模式
 
+```
 
+## use
 
+```
 
+yarn 
+yarn dev
 
+yarn build
 
+
 
 ```
 
 ```
 
+
 
+
 
 ## 目录结构
 
 ## 目录结构
 
 ```
 
 ```
 
 | - `src`
 
 | - `src`
 
 |   - `pages`                     全局入口目录
 
 |   - `pages`                     全局入口目录
 
-|       - `index`                 首页入口子目录
 
+|       - `index`                 首页html入口目录
 
 |           - `assets`            子静态文件
 
 |           - `assets`            子静态文件
 
 |           - `components`        子组件
 
 |           - `components`        子组件
 
-|           - `router`            子路由
 
 |           - `store`             子存储
 
 |           - `store`             子存储
 
 |           - `views`             子页面
 
 |           - `views`             子页面
 
 |           - `App.vue`           子模板
 
 |           - `App.vue`           子模板
 
 |           - `main.ts`           子入口文件
 
 |           - `main.ts`           子入口文件
 
-|       - `admin`                 后台管理入口子目录
 
+|       - `admin`                 后台管理html入口目录
 
 |           - `assets`            子静态文件
 
 |           - `assets`            子静态文件
 
 |           - `components`        子组件
 
 |           - `components`        子组件
 
-|           - `router`            子路由
 
 |           - `store`             子存储
 
 |           - `store`             子存储
 
 |           - `views`             子页面
 
 |           - `views`             子页面
 
 |           - `App.vue`           子模板
 
 |           - `App.vue`           子模板
 
 |           - `main.ts`           子入口文件
 
 |           - `main.ts`           子入口文件
 
-|       - `login`                 登录入口子目录
 
+|       - `login`                 登录html入口目录
 
 |           - `assets`            子静态文件
 
 |           - `assets`            子静态文件
 
 |           - `components`        子组件
 
 |           - `components`        子组件
 
-|           - `router`            子路由
 
 |           - `store`             子存储
 
 |           - `store`             子存储
 
 |           - `views`             子页面
 
 |           - `views`             子页面
 
 |           - `App.vue`           子模板
 
 |           - `App.vue`           子模板
 
@@ -65,7 +79,3 @@ import { onMounted, ref, computed} from 'vue'
 
 
 
 ```
 
 ```
 
 
 
-## use
 
-```
 
-
 
-```

+ 0 - 1
index.html
View File 

@@ -2,7 +2,6 @@
 
 <html lang="en">
 
 <html lang="en">
 
   <head>
 
   <head>
 
     <meta charset="UTF-8" />
 
     <meta charset="UTF-8" />
 
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
     <title>智慧隧道AI建造</title>
 
     <title>智慧隧道AI建造</title>
 
   </head>
 
   </head>

+ 1 - 0
package.json
View File 

@@ -9,6 +9,7 @@
 
     "preview": "vite preview"
 
     "preview": "vite preview"
 
   },
 
   },
 
   "dependencies": {
 
   "dependencies": {
 
+    "anywhere": "^1.6.0",
 
     "axios": "^0.27.2",
 
     "axios": "^0.27.2",
 
     "js-md5": "^0.7.3",
 
     "js-md5": "^0.7.3",
 
     "naive-ui": "^2.32.1",
 
     "naive-ui": "^2.32.1",

+ 11 - 2
src/pages/admin/main.ts
View File 

@@ -2,12 +2,21 @@ import { createApp } from 'vue'
 
 import App from './App.vue'
 
 import App from './App.vue'
 
 import { createPinia } from 'pinia'
 
 import { createPinia } from 'pinia'
 
 import naive from './assets/js/nativeUiPluginPublic'
 
 import naive from './assets/js/nativeUiPluginPublic'
 
-import router from './router'
 
+import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router'
 
 import '@/utils/rem'
 
 import '@/utils/rem'
 
+// 动态路由
 
+const routes = Object.values(import.meta.glob('./views/*/route.ts', { eager: true })).map((m) => (m as any).default || m)
 
+console.log(routes)
 
+
 
 const store = createPinia()
 
 const store = createPinia()
 
 const app = createApp(App)
 
 const app = createApp(App)
 
+const router = createRouter({
 
+  history: createWebHashHistory(),
 
+  routes
 
+})
 
+// 路由守卫
 
 
 
 app.use(store)
 
 app.use(store)
 
-  .use(router)
 
   .use(naive)
 
   .use(naive)
 
+  .use(router)
 
   .mount('#app')
 
   .mount('#app')

+ 0 - 13
src/pages/admin/router/index.ts
View File 

@@ -1,13 +0,0 @@
 
-import { createRouter, createWebHashHistory } from 'vue-router'
 
-
 
-const routes = [
 
-  {
 
-    path: '/',
 
-    component: () => import('../views/test.vue')
 
-  }
 
-]
 
-const router = createRouter({
 
-  history: createWebHashHistory(),
 
-  routes
 
-})
 
-export default router

+ 0 - 0
src/pages/admin/views/test.vue → src/pages/admin/views/home/index.vue
View File


+ 10 - 0
src/pages/admin/views/home/route.ts
View File 

@@ -0,0 +1,10 @@
 
+import { RouteRecordRaw } from 'vue-router'
 
+
 
+export default {
 
+  path: '/',
 
+  meta: {
 
+    authorize: true
 
+  },
 
+  component: () => import('./index.vue' as any),
 
+  children: []
 
+} as RouteRecordRaw

+ 3 - 0
src/pages/admin/views/test/index.vue
View File 

@@ -0,0 +1,3 @@
 
+<template>
 
+  <div>345</div>
 
+</template>

+ 11 - 0
src/pages/admin/views/test/route.ts
View File 

@@ -0,0 +1,11 @@
 
+import { RouteRecordRaw } from 'vue-router'
 
+
 
+export default {
 
+  path: '/test',
 
+  meta: {
 
+    authorize: true
 
+  },
 
+  component: () => import('./index.vue' as any),
 
+  children: [
 
+  ]
 
+} as RouteRecordRaw

+ 3 - 0
src/pages/index/assets/js/interfacePublic.ts
View File 

@@ -0,0 +1,3 @@
 
+export interface test{
 
+    a:string
 
+}

+ 8 - 1
src/pages/index/main.ts
View File 

@@ -1,10 +1,17 @@
 
 import { createApp } from 'vue'
 
 import { createApp } from 'vue'
 
 import App from './App.vue'
 
 import App from './App.vue'
 
 import { createPinia } from 'pinia'
 
 import { createPinia } from 'pinia'
 
-import router from './router'
 
 import naive from './assets/js/nativeUiPluginPublic'
 
 import naive from './assets/js/nativeUiPluginPublic'
 
+import { createRouter, createWebHistory } from 'vue-router'
 
+// 动态路由
 
+const routes = Object.values(import.meta.glob('./views/*/route.ts', { eager: true })).map((m) => (m as any).default || m)
 
 const store = createPinia()
 
 const store = createPinia()
 
 const app = createApp(App)
 
 const app = createApp(App)
 
+const router = createRouter({
 
+  history: createWebHistory(),
 
+  routes
 
+})
 
+// 路由守卫
 
 
 
 app.use(store)
 
 app.use(store)
 
   .use(naive)
 
   .use(naive)

+ 0 - 19
src/pages/index/router/index.ts
View File 

@@ -1,19 +0,0 @@
 
-import { createRouter, createWebHashHistory } from 'vue-router'
 
-
 
-const routes = [
 
-  {
 
-    path: '/',
 
-    component: () => import('../views/test.vue')
 
-
 
-  },
 
-  // 重定向
 
-  {
 
-    path: '/:pathMatch(.*)*',
 
-    redirect: '/'
 
-  }
 
-]
 
-const router = createRouter({
 
-  history: createWebHashHistory(),
 
-  routes
 
-})
 
-export default router

+ 0 - 0
src/pages/index/views/test.vue → src/pages/index/views/home/index.vue
View File


+ 10 - 0
src/pages/index/views/home/route.ts
View File 

@@ -0,0 +1,10 @@
 
+import { RouteRecordRaw } from 'vue-router'
 
+
 
+export default {
 
+  path: '/',
 
+  meta: {
 
+    authorize: true
 
+  },
 
+  component: () => import('./index.vue' as any),
 
+  children: []
 
+} as RouteRecordRaw

+ 3 - 0
src/pages/index/views/test/index.vue
View File 

@@ -0,0 +1,3 @@
 
+<template>
 
+  <div>123</div>
 
+</template>

+ 11 - 0
src/pages/index/views/test/route.ts
View File 

@@ -0,0 +1,11 @@
 
+import { RouteRecordRaw } from 'vue-router'
 
+
 
+export default {
 
+  path: '/test',
 
+  meta: {
 
+    authorize: true
 
+  },
 
+  component: () => import('./index.vue' as any),
 
+  children: [
 
+  ]
 
+} as RouteRecordRaw