7cd91082d6
Agent Loop: 3 agents, all passed - Inspection: index/detail, records index/detail - InspectionProblem: index/detail/management - Maintenance: index/detail, records index/detail, check index
148 lines
3.2 KiB
TypeScript
148 lines
3.2 KiB
TypeScript
/**
|
||
* 应用入口 — Yuto Water H5
|
||
*
|
||
* 初始化 Vue 应用，集成 Vant 4 UI、Pinia 状态管理、
|
||
* Vue Router 路由、全局样式等核心模块。
|
||
*
|
||
* @module main
|
||
*/
|
||
|
||
import { createApp } from 'vue'
|
||
import { createPinia } from 'pinia'
|
||
|
||
// ── Vant 4 组件按需注册 ──
|
||
import {
|
||
ConfigProvider,
|
||
NavBar,
|
||
Tabbar,
|
||
TabbarItem,
|
||
Button,
|
||
Form,
|
||
Field,
|
||
Cell,
|
||
CellGroup,
|
||
Popup,
|
||
Uploader,
|
||
PullRefresh,
|
||
List,
|
||
Tabs,
|
||
Tab,
|
||
Divider,
|
||
Loading,
|
||
Icon,
|
||
Grid,
|
||
GridItem,
|
||
Empty,
|
||
Search,
|
||
Card,
|
||
Image,
|
||
Tag,
|
||
} from 'vant'
|
||
|
||
// ── Vant 样式（组件样式按需引入） ──
|
||
import 'vant/lib/index.css'
|
||
|
||
// ── 全局样式 ──
|
||
import './styles/index.scss'
|
||
|
||
// ── 路由 ──
|
||
import router from './router'
|
||
|
||
// ── 根组件 ──
|
||
import App from './App.vue'
|
||
|
||
// ══════════════════════════════════════════════
|
||
// 创建应用
|
||
// ══════════════════════════════════════════════
|
||
|
||
const app = createApp(App)
|
||
|
||
// ── 注册 Pinia ──
|
||
const pinia = createPinia()
|
||
app.use(pinia)
|
||
|
||
// ── 注册 Vant 组件（组件类） ──
|
||
// Toast / Dialog / ImagePreview 为函数式 API，
|
||
// 直接从 vant 导入即可使用，无需 app.use 注册。
|
||
const vantComponents = [
|
||
ConfigProvider,
|
||
NavBar,
|
||
Tabbar,
|
||
TabbarItem,
|
||
Button,
|
||
Form,
|
||
Field,
|
||
Cell,
|
||
CellGroup,
|
||
Popup,
|
||
Uploader,
|
||
PullRefresh,
|
||
List,
|
||
Tabs,
|
||
Tab,
|
||
Divider,
|
||
Loading,
|
||
Icon,
|
||
Grid,
|
||
GridItem,
|
||
Empty,
|
||
Search,
|
||
Card,
|
||
Image,
|
||
Tag,
|
||
]
|
||
|
||
for (const component of vantComponents) {
|
||
app.use(component)
|
||
}
|
||
|
||
// ── 注册路由 ──
|
||
app.use(router)
|
||
|
||
// ══════════════════════════════════════════════
|
||
// 挂载应用（带错误处理）
|
||
// ══════════════════════════════════════════════
|
||
|
||
try {
|
||
app.mount('#app')
|
||
} catch (err) {
|
||
console.error('[Yuto Water H5] 应用挂载失败:', err)
|
||
// 在 DOM 中展示降级错误信息
|
||
const root = document.getElementById('app')
|
||
if (root) {
|
||
root.innerHTML = `
|
||
<div style="
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
height: 100vh;
|
||
font-family: -apple-system, BlinkMacSystemFont, sans-serif;
|
||
color: #323233;
|
||
text-align: center;
|
||
padding: 24px;
|
||
">
|
||
<h1 style="font-size: 20px; margin-bottom: 8px;">应用加载失败</h1>
|
||
<p style="font-size: 14px; color: #969799;">
|
||
${err instanceof Error ? err.message : '未知错误'}
|
||
</p>
|
||
<button
|
||
onclick="location.reload()"
|
||
style="
|
||
margin-top: 16px;
|
||
padding: 8px 24px;
|
||
border: none;
|
||
border-radius: 8px;
|
||
background: #2196F3;
|
||
color: #fff;
|
||
font-size: 14px;
|
||
cursor: pointer;
|
||
"
|
||
>
|
||
重新加载
|
||
</button>
|
||
</div>
|
||
`
|
||
}
|
||
}
|