路由切换

This commit is contained in:
zhang zhuo 2025-06-12 13:59:14 +08:00
parent eb9f60ca0d
commit 6c8d57a4da
13 changed files with 46 additions and 37 deletions

View File

@ -5,5 +5,5 @@ VITE_APP_TITLE=里派基础框架
VITE_APP_ENV='development' VITE_APP_ENV='development'
# 开发环境 # 开发环境
VITE_API_BASE='/dev-api' VITE_API_BASE='https://dev.api.leapy.cn/merchant/'
VITE_WS_URL='/dev-api' VITE_WS_URL='wss://dev.api.leapy.cn/mms'

View File

@ -5,8 +5,8 @@ VITE_APP_TITLE=里派基础框架
VITE_APP_ENV='production' VITE_APP_ENV='production'
# 生产环境 # 生产环境
VITE_API_BASE='/prod-api' VITE_API_BASE='https://dev.api.leapy.cn/merchant/'
VITE_WS_URL='/prod-api' VITE_WS_URL='wss://dev.api.leapy.cn/mms'
# 是否在打包时开启压缩,支持 gzip 和 brotli # 是否在打包时开启压缩,支持 gzip 和 brotli
VITE_BUILD_COMPRESS=gzip VITE_BUILD_COMPRESS=gzip

View File

@ -1,12 +0,0 @@
# 页面标题
VITE_APP_TITLE=里派基础框架
# 生产环境配置
VITE_APP_ENV='staging'
# 生产环境
VITE_API_BASE='/staging-api'
VITE_WS_URL='/staging-api'
# 是否在打包时开启压缩,支持 gzip 和 brotli
VITE_BUILD_COMPRESS=gzip

View File

@ -6,9 +6,6 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="images/logo.png"> <link rel="icon" href="images/logo.png">
<title>%VITE_APP_TITLE%</title> <title>%VITE_APP_TITLE%</title>
<script type="text/javascript">
document.write("<script src='config.ts?" + new Date().getTime() + "'><\/script>");
</script>
</head> </head>
<body> <body>
<noscript> <noscript>

View File

@ -7,7 +7,6 @@
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build:prod": "vite build", "build:prod": "vite build",
"build:stage": "vite build --mode staging",
"preview": "vite preview" "preview": "vite preview"
}, },
"dependencies": { "dependencies": {
@ -16,9 +15,10 @@
"crypto-js": "^4.2.0", "crypto-js": "^4.2.0",
"element-plus": "^2.9.10", "element-plus": "^2.9.10",
"nprogress": "^0.2.0", "nprogress": "^0.2.0",
"pinia": "^3.0.3",
"sortablejs": "^1.15.6", "sortablejs": "^1.15.6",
"vue": "^3.5.14", "vue": "^3.5.14",
"vue-i18n": "^12.0.0-alpha.2", "vue-i18n": "^11.1.5",
"vue-router": "^4.5.1", "vue-router": "^4.5.1",
"vuedraggable": "^2.24.3", "vuedraggable": "^2.24.3",
"vuex": "^4.1.0" "vuex": "^4.1.0"

View File

View File

@ -2,7 +2,7 @@ export default {
// 应用名称 // 应用名称
APP_NAME: import.meta.env.VITE_APP_TITLE, APP_NAME: import.meta.env.VITE_APP_TITLE,
//接口地址 //接口地址
API_URL: import.meta.env.VITE_API_BASE, API_URL: import.meta.env.VITE_APP_ENV === 'development' ? "/api" : import.meta.env.VITE_API_BASE,
// websocket // websocket
WS_URL: import.meta.env.VITE_WS_URL, WS_URL: import.meta.env.VITE_WS_URL,
//请求超时 //请求超时

View File

@ -267,6 +267,11 @@ onLayoutResize();
window.addEventListener('resize', onLayoutResize); window.addEventListener('resize', onLayoutResize);
showThis() showThis()
console.log(store.state.keepAlive.keepLiveRoute)
console.log(route.fullPath)
console.log(store.state.keepAlive.routeShow)
watch(route, () => { watch(route, () => {
showThis() showThis()
}) })

View File

@ -4,8 +4,8 @@ import el_en from 'element-plus/dist/locale/en'
import config from "@/config" import config from "@/config"
import tools from '@/utils/tools' import tools from '@/utils/tools'
import zh_cn from './lang/zh-cn' import zh_cn from '@/locales/lang/zh-cn'
import en from './lang/en' import en from '@/locales/lang/en'
const messages = { const messages = {
'zh-cn': { 'zh-cn': {

View File

@ -2,6 +2,9 @@ import store from '@/store'
import {nextTick} from 'vue' import {nextTick} from 'vue'
import {RouteLocationNormalized, RouteLocationNormalizedLoaded} from "vue-router"; import {RouteLocationNormalized, RouteLocationNormalizedLoaded} from "vue-router";
import tools from "@/utils/tools"; import tools from "@/utils/tools";
import {h} from 'vue'
const modules: Record<string, () => Promise<any>> = import.meta.glob('@/views/**/*.vue')
export function beforeEach(to: RouteLocationNormalized, from: RouteLocationNormalizedLoaded) { export function beforeEach(to: RouteLocationNormalized, from: RouteLocationNormalizedLoaded) {
const piMain = document.querySelector('#pi-main'); const piMain = document.querySelector('#pi-main');
@ -53,11 +56,19 @@ export function filterAsyncRouter(routerMap) {
} }
export function loadComponent(component: string) { export function loadComponent(component: string) {
if (component) { // 如果路径为空,直接返回一个空的组件
return () => import(/* @vite-ignore */`/src/views/${component}`) if (component === '') {
} else { return
return () => import(`@/layout/empty`)
} }
// 构建可能的路径
const fullPath = `/src/views/${component}.vue`
const fullPathWithIndex = `/src/views/${component}/index.vue`
// 先尝试直接路径,再尝试添加/index的路径
const module = modules[fullPath] || modules[fullPathWithIndex]
if (!module) {
return
}
return module
} }
//路由扁平化 //路由扁平化

View File

@ -1,5 +1,6 @@
<template> <template>
<div> <div>
<el-input v-model="form" placeholder="111"/>
<el-button plain @click="showClick">点我</el-button> <el-button plain @click="showClick">点我</el-button>
<pi-dialog v-model="show" ref="dialog"></pi-dialog> <pi-dialog v-model="show" ref="dialog"></pi-dialog>
</div> </div>
@ -12,6 +13,8 @@ const {proxy} = getCurrentInstance()
let show = ref(false) let show = ref(false)
let form = ref("")
function showClick() { function showClick() {
show.value = true show.value = true
} }

3
vite-env.d.ts vendored
View File

@ -10,7 +10,8 @@ interface ImportMeta {
interface ImportMetaEnv { interface ImportMetaEnv {
readonly VITE_API_BASE: string readonly VITE_API_BASE: string
readonly VITE_APP_TITLE: string readonly VITE_APP_TITLE: string
readonly VITE_WS_URL: string readonly VITE_WS_URL: string,
readonly VITE_APP_ENV: string
} }
interface Document { interface Document {

View File

@ -1,19 +1,22 @@
import {defineConfig} from 'vite' import {defineConfig, loadEnv} from 'vite'
import vue from '@vitejs/plugin-vue' import vue from '@vitejs/plugin-vue'
import path from 'path' import path from 'path'
import { fileURLToPath } from 'url'
export default defineConfig(({}) => { export default defineConfig(({mode, command}) => {
const env = loadEnv(mode, process.cwd())
const {VITE_API_BASE} = env
return { return {
resolve: { resolve: {
alias: { alias: {
// 设置路径 // 设置路径
'~': path.resolve(__dirname, './'), '~': path.resolve(__dirname, './'),
// 设置别名 // 设置别名
'@': path.resolve(__dirname, './src'), '@': fileURLToPath(new URL('./src', import.meta.url)),
// 资源地址 // 资源地址
'@assets': path.resolve(__dirname, './src/assets') '@assets': path.resolve(__dirname, 'src/assets')
}, },
extensions: ['.ts', '.json', '.vue', '.js'] extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']
}, },
base: '/', base: '/',
// vite 相关配置 // vite 相关配置
@ -22,16 +25,17 @@ export default defineConfig(({}) => {
host: true, host: true,
// open: true, // open: true,
proxy: { proxy: {
'/dev-api': { '/api': {
target: 'https://dev.api.leapy.cn/merchant/', target: VITE_API_BASE,
changeOrigin: true, changeOrigin: true,
rewrite: (p) => p.replace(/^\/dev-api/, '') rewrite: (p) => p.replace(/^\/api/, '')
} }
} }
}, },
build: { build: {
outDir: 'dist', outDir: 'dist',
assetsDir: 'static', assetsDir: 'static',
chunkSizeWarningLimit: 2000,
sourcemap: true, sourcemap: true,
rollupOptions: { rollupOptions: {
output: { output: {