Spaces:
Running
Running
zhouwei commited on
Commit ·
7f62bc9
1
Parent(s): edda47e
修复Hugging Face Spaces部署问题: 使用相对路径和Hash路由模式
Browse files- index.html +42 -4
- src/main.ts +23 -1
- src/router/index.ts +2 -2
- vite.config.ts +1 -0
index.html
CHANGED
|
@@ -1,13 +1,51 @@
|
|
| 1 |
<!DOCTYPE html>
|
| 2 |
-
<html lang="">
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
| 5 |
-
<link rel="icon" href="/favicon.ico">
|
| 6 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 7 |
-
<
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 8 |
</head>
|
| 9 |
<body>
|
| 10 |
-
<div id="app">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 11 |
<script type="module" src="/src/main.ts"></script>
|
| 12 |
</body>
|
| 13 |
</html>
|
|
|
|
| 1 |
<!DOCTYPE html>
|
| 2 |
+
<html lang="zh-CN">
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
| 5 |
+
<link rel="icon" href="./favicon.ico">
|
| 6 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 7 |
+
<meta name="description" content="程序员小溪的个人网站">
|
| 8 |
+
<title>程序员小溪 - 全栈开发者</title>
|
| 9 |
+
<style>
|
| 10 |
+
/* 加载动画 */
|
| 11 |
+
.loading {
|
| 12 |
+
position: fixed;
|
| 13 |
+
top: 0;
|
| 14 |
+
left: 0;
|
| 15 |
+
width: 100%;
|
| 16 |
+
height: 100%;
|
| 17 |
+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
| 18 |
+
display: flex;
|
| 19 |
+
justify-content: center;
|
| 20 |
+
align-items: center;
|
| 21 |
+
z-index: 9999;
|
| 22 |
+
color: white;
|
| 23 |
+
font-family: Arial, sans-serif;
|
| 24 |
+
}
|
| 25 |
+
.loading-spinner {
|
| 26 |
+
width: 40px;
|
| 27 |
+
height: 40px;
|
| 28 |
+
border: 4px solid rgba(255, 255, 255, 0.3);
|
| 29 |
+
border-top: 4px solid white;
|
| 30 |
+
border-radius: 50%;
|
| 31 |
+
animation: spin 1s linear infinite;
|
| 32 |
+
}
|
| 33 |
+
@keyframes spin {
|
| 34 |
+
0% { transform: rotate(0deg); }
|
| 35 |
+
100% { transform: rotate(360deg); }
|
| 36 |
+
}
|
| 37 |
+
</style>
|
| 38 |
</head>
|
| 39 |
<body>
|
| 40 |
+
<div id="app">
|
| 41 |
+
<!-- 加载提示 -->
|
| 42 |
+
<div class="loading">
|
| 43 |
+
<div>
|
| 44 |
+
<div class="loading-spinner"></div>
|
| 45 |
+
<p style="margin-top: 20px;">正在加载...</p>
|
| 46 |
+
</div>
|
| 47 |
+
</div>
|
| 48 |
+
</div>
|
| 49 |
<script type="module" src="/src/main.ts"></script>
|
| 50 |
</body>
|
| 51 |
</html>
|
src/main.ts
CHANGED
|
@@ -6,9 +6,31 @@ import { createPinia } from 'pinia'
|
|
| 6 |
import App from './App.vue'
|
| 7 |
import router from './router'
|
| 8 |
|
|
|
|
| 9 |
const app = createApp(App)
|
| 10 |
|
| 11 |
app.use(createPinia())
|
| 12 |
app.use(router)
|
| 13 |
|
| 14 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 6 |
import App from './App.vue'
|
| 7 |
import router from './router'
|
| 8 |
|
| 9 |
+
// 创建应用实例
|
| 10 |
const app = createApp(App)
|
| 11 |
|
| 12 |
app.use(createPinia())
|
| 13 |
app.use(router)
|
| 14 |
|
| 15 |
+
// 添加错误处理
|
| 16 |
+
app.config.errorHandler = (err, vm, info) => {
|
| 17 |
+
console.error('Vue应用错误:', err, info)
|
| 18 |
+
}
|
| 19 |
+
|
| 20 |
+
// 确保DOM已加载后再挂载应用
|
| 21 |
+
const mountApp = () => {
|
| 22 |
+
const appElement = document.getElementById('app')
|
| 23 |
+
if (appElement) {
|
| 24 |
+
app.mount('#app')
|
| 25 |
+
} else {
|
| 26 |
+
console.error('未找到#app元素')
|
| 27 |
+
}
|
| 28 |
+
}
|
| 29 |
+
|
| 30 |
+
// 如果DOM已加载，直接挂载；否则等待DOM加载完成
|
| 31 |
+
if (document.readyState === 'loading') {
|
| 32 |
+
document.addEventListener('DOMContentLoaded', mountApp)
|
| 33 |
+
} else {
|
| 34 |
+
// 使用setTimeout确保在下一个事件循环中挂载
|
| 35 |
+
setTimeout(mountApp, 0)
|
| 36 |
+
}
|
src/router/index.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
| 1 |
-
import { createRouter,
|
| 2 |
import HomeView from '../views/HomeView.vue'
|
| 3 |
|
| 4 |
const router = createRouter({
|
| 5 |
-
history:
|
| 6 |
routes: [
|
| 7 |
{
|
| 8 |
path: '/',
|
|
|
|
| 1 |
+
import { createRouter, createWebHashHistory } from 'vue-router'
|
| 2 |
import HomeView from '../views/HomeView.vue'
|
| 3 |
|
| 4 |
const router = createRouter({
|
| 5 |
+
history: createWebHashHistory(import.meta.env.BASE_URL),
|
| 6 |
routes: [
|
| 7 |
{
|
| 8 |
path: '/',
|
vite.config.ts
CHANGED
|
@@ -6,6 +6,7 @@ import vueDevTools from 'vite-plugin-vue-devtools'
|
|
| 6 |
|
| 7 |
// https://vite.dev/config/
|
| 8 |
export default defineConfig({
|
|
|
|
| 9 |
plugins: [
|
| 10 |
vue(),
|
| 11 |
vueDevTools(),
|
|
|
|
| 6 |
|
| 7 |
// https://vite.dev/config/
|
| 8 |
export default defineConfig({
|
| 9 |
+
base: './', // 使用相对路径，适配静态部署环境
|
| 10 |
plugins: [
|
| 11 |
vue(),
|
| 12 |
vueDevTools(),
|