68 lines
2.2 KiB
HTML
68 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<title>Debug Page</title>
|
||
<style>
|
||
body { font-family: Arial, sans-serif; padding: 20px; }
|
||
.test { background: #f0f0f0; padding: 10px; margin: 10px 0; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<h1>調試頁面</h1>
|
||
<div class="test">
|
||
<h3>基礎測試</h3>
|
||
<p>✅ HTML正常顯示</p>
|
||
<p id="js-test">⏳ JavaScript測試中...</p>
|
||
</div>
|
||
|
||
<div class="test">
|
||
<h3>網絡測試</h3>
|
||
<p id="main-js">⏳ 檢查main.js...</p>
|
||
<p id="vue-app">⏳ 檢查Vue應用...</p>
|
||
</div>
|
||
|
||
<div class="test">
|
||
<h3>控制台訊息</h3>
|
||
<p>請打開瀏覽器開發者工具(F12) -> Console面板，查看是否有錯誤訊息</p>
|
||
</div>
|
||
|
||
<script>
|
||
console.log('=== Debug Page Loaded ===');
|
||
|
||
// 基礎JavaScript測試
|
||
document.getElementById('js-test').innerHTML = '✅ JavaScript正常執行';
|
||
|
||
// 檢查main.js是否可以載入
|
||
fetch('/src/main.ts')
|
||
.then(response => {
|
||
document.getElementById('main-js').innerHTML =
|
||
response.ok ? '✅ main.ts可以訪問' : '❌ main.ts無法訪問';
|
||
})
|
||
.catch(err => {
|
||
document.getElementById('main-js').innerHTML = '❌ main.ts載入失敗: ' + err.message;
|
||
});
|
||
|
||
// 檢查Vue應用DOM
|
||
setTimeout(() => {
|
||
const app = document.querySelector('#app');
|
||
if (app) {
|
||
const isEmpty = app.innerHTML.trim() === '';
|
||
document.getElementById('vue-app').innerHTML =
|
||
isEmpty ? '❌ Vue應用DOM為空' : '✅ Vue應用DOM有內容';
|
||
console.log('Vue app content:', app.innerHTML);
|
||
} else {
|
||
document.getElementById('vue-app').innerHTML = '❌ 找不到#app元素';
|
||
}
|
||
}, 2000);
|
||
|
||
// 檢查Vue是否載入
|
||
setTimeout(() => {
|
||
if (window.Vue) {
|
||
console.log('✅ Vue已載入:', window.Vue);
|
||
} else {
|
||
console.log('❌ Vue未載入');
|
||
}
|
||
}, 3000);
|
||
</script>
|
||
</body>
|
||
</html> |