wuxu/transfer_sms
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
wuxu
2026-04-28 17:34:03 +08:00
commit 80ee99e564
43 changed files with 6330 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/.gitignore vendored Normal file
View File

@@ -0,0 +1,2 @@
node_modules/
dist/

15
web/Dockerfile Normal file
View File

@@ -0,0 +1,15 @@
FROM node:22-alpine AS build
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm ci
COPY . .
RUN npm run build
FROM nginx:alpine
COPY nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=build /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

16
web/index.html Normal file
View File

@@ -0,0 +1,16 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>SMS Monitor</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0" rel="stylesheet" />
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

17
web/nginx.conf Normal file
View File

@@ -0,0 +1,17 @@
server {
listen 80;
server_name localhost;
root /usr/share/nginx/html;
index index.html;
location / {
try_files $uri /index.html;
}
location /api/ {
proxy_pass http://host.docker.internal:3000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
}
}

1846
web/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

22
web/package.json Normal file
View File

@@ -0,0 +1,22 @@
{
"name": "sms-web",
"private": true,
"version": "1.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"preview": "vite preview"
},
"dependencies": {
"react": "^18.3.1",
"react-dom": "^18.3.1"
},
"devDependencies": {
"@types/react": "^18.3.12",
"@types/react-dom": "^18.3.1",
"@vitejs/plugin-react": "^4.3.4",
"typescript": "^5.6.0",
"vite": "^6.0.0"
}
}

19
web/src/App.tsx Normal file
View File

@@ -0,0 +1,19 @@
import { useState, useEffect, useCallback } from 'react';
import Login from './pages/Login';
import SmsList from './pages/SmsList';
export default function App() {
const [authed, setAuthed] = useState(false);
useEffect(() => {
if (localStorage.getItem('token')) setAuthed(true);
}, []);
const handleLogout = useCallback(() => {
localStorage.removeItem('token');
setAuthed(false);
}, []);
if (!authed) return <Login onLogin={() => setAuthed(true)} />;
return <SmsList onLogout={handleLogout} />;
}

64
web/src/api.ts Normal file
View File

@@ -0,0 +1,64 @@
const BASE = '/api';
function token() { return localStorage.getItem('token') || ''; }
function authHeaders() { return { 'Authorization': `Bearer ${token()}`, 'Content-Type': 'application/json; charset=utf-8' }; }
export interface SmsMessage {
id: number;
user_id: number;
phone_number: string;
contact_name: string | null;
content: string;
type: 'received' | 'sent';
sms_date: string;
created_at: string;
}
export interface SmsListResponse {
messages: SmsMessage[];
total: number;
page: number;
limit: number;
totalPages: number;
}
async function parseError(res: Response): Promise<string> {
try {
const data = await res.json();
return data.error || `${res.status} ${res.statusText}`;
} catch {
return `${res.status} ${res.statusText}`;
}
}
export async function login(username: string, password: string) {
const res = await fetch(`${BASE}/auth/login`, {
method: 'POST',
headers: { 'Content-Type': 'application/json; charset=utf-8' },
body: JSON.stringify({ username, password }),
});
if (!res.ok) throw new Error(await parseError(res));
return res.json();
}
export async function register(username: string, password: string) {
const res = await fetch(`${BASE}/auth/register`, {
method: 'POST',
headers: { 'Content-Type': 'application/json; charset=utf-8' },
body: JSON.stringify({ username, password }),
});
if (!res.ok) throw new Error(await parseError(res));
return res.json();
}
export async function fetchSms(params: Record<string, string> = {}): Promise<SmsListResponse> {
const qs = new URLSearchParams(params).toString();
const res = await fetch(`${BASE}/sms?${qs}`, { headers: authHeaders() });
if (!res.ok) throw new Error('Failed to fetch');
return res.json();
}
export async function deleteSms(id: number) {
const res = await fetch(`${BASE}/sms/${id}`, { method: 'DELETE', headers: authHeaders() });
if (!res.ok) throw new Error('Delete failed');
}

108
web/src/index.css Normal file
View File

@@ -0,0 +1,108 @@
:root {
--bg-primary: #0f0f13;
--bg-secondary: #1a1a24;
--bg-card: #1e1e2a;
--bg-hover: #252533;
--bg-input: #16161f;
--border: #2a2a3a;
--border-focus: #6c5ce7;
--text-primary: #f0f0f5;
--text-secondary: #9d9db5;
--text-muted: #606078;
--accent: #7c6ff7;
--accent-hover: #9080ff;
--accent-subtle: rgba(124, 111, 247, 0.12);
--green: #4ade80;
--green-bg: rgba(74, 222, 128, 0.1);
--blue: #60a5fa;
--blue-bg: rgba(96, 165, 250, 0.1);
--red: #f87171;
--red-hover: #fa8a8a;
--red-bg: rgba(248, 113, 113, 0.1);
--radius-sm: 8px;
--radius: 12px;
--radius-lg: 16px;
--shadow-sm: 0 1px 2px rgba(0,0,0,0.3);
--shadow: 0 4px 12px rgba(0,0,0,0.4);
--shadow-lg: 0 8px 32px rgba(0,0,0,0.5);
--transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: 15px; }
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
background: var(--bg-primary);
color: var(--text-primary);
min-height: 100vh;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
input, select, button { font-family: inherit; }
input, select {
font-size: 0.9rem;
padding: 10px 14px;
border: 1.5px solid var(--border);
border-radius: var(--radius-sm);
background: var(--bg-input);
color: var(--text-primary);
outline: none;
transition: border-color var(--transition), box-shadow var(--transition);
}
input::placeholder { color: var(--text-muted); }
input:focus, select:focus {
border-color: var(--border-focus);
box-shadow: 0 0 0 3px rgba(108, 92, 231, 0.2);
}
button {
font-weight: 500;
font-size: 0.875rem;
border: none;
border-radius: var(--radius-sm);
padding: 10px 20px;
cursor: pointer;
transition: all var(--transition);
display: inline-flex; align-items: center; gap: 6px;
}
.btn-primary {
background: var(--accent);
color: #fff;
}
.btn-primary:hover { background: var(--accent-hover); transform: translateY(-1px); box-shadow: 0 4px 16px rgba(124,111,247,0.35); }
.btn-primary:active { transform: translateY(0); }
.btn-ghost {
background: transparent;
color: var(--text-secondary);
border: 1.5px solid var(--border);
}
.btn-ghost:hover { background: var(--bg-hover); color: var(--text-primary); border-color: var(--text-muted); }
.btn-danger {
background: transparent;
color: var(--red);
border: 1.5px solid transparent;
padding: 6px 14px;
font-size: 0.8rem;
}
.btn-danger:hover { background: var(--red-bg); border-color: rgba(248,113,113,0.3); }
.btn-icon {
background: transparent;
color: var(--text-secondary);
border: none;
padding: 8px;
border-radius: var(--radius-sm);
}
.btn-icon:hover { background: var(--bg-hover); color: var(--text-primary); }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }

10
web/src/main.tsx Normal file
View File

@@ -0,0 +1,10 @@
import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';
import './index.css';
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>
<App />
</React.StrictMode>
);

57
web/src/pages/Login.css Normal file
View File

@@ -0,0 +1,57 @@
.login-page {
display: flex; align-items: center; justify-content: center;
min-height: 100vh; position: relative; overflow: hidden;
}
.login-bg-decor {
position: absolute; inset: 0;
background:
radial-gradient(ellipse 80% 60% at 50% 20%, rgba(124,111,247,0.08) 0%, transparent 60%),
radial-gradient(ellipse 50% 50% at 80% 80%, rgba(124,111,247,0.05) 0%, transparent 50%);
pointer-events: none;
}
.login-card {
position: relative;
background: var(--bg-card);
border: 1px solid var(--border);
border-radius: var(--radius-lg);
box-shadow: var(--shadow-lg);
padding: 44px 40px 36px;
width: 420px; max-width: 90vw;
display: flex; flex-direction: column; align-items: center; gap: 20px;
}
.login-icon {
width: 56px; height: 56px;
background: var(--accent-subtle);
border-radius: var(--radius);
display: flex; align-items: center; justify-content: center;
}
.login-icon .material-symbols-outlined {
font-size: 28px; color: var(--accent);
}
.login-card h1 {
font-size: 1.6rem; font-weight: 700; letter-spacing: -0.02em;
}
.login-card .subtitle {
color: var(--text-muted); font-size: 0.9rem; margin-top: -12px;
}
.login-fields { width: 100%; display: flex; flex-direction: column; gap: 12px; }
.field { position: relative; display: flex; align-items: center; }
.field-icon {
position: absolute; left: 14px; font-size: 20px; color: var(--text-muted);
pointer-events: none;
}
.field input { width: 100%; padding-left: 42px; }
.error-msg {
width: 100%;
display: flex; align-items: center; gap: 8px;
background: var(--red-bg); border: 1px solid rgba(248,113,113,0.25);
border-radius: var(--radius-sm); padding: 10px 14px;
color: var(--red); font-size: 0.85rem;
}
.error-msg .material-symbols-outlined { font-size: 18px; }
.login-buttons {
width: 100%; display: flex; flex-direction: column; gap: 10px; margin-top: 4px;
}
.login-buttons button { width: 100%; justify-content: center; padding: 12px; font-size: 0.9rem; }

82
web/src/pages/Login.tsx Normal file
View File

@@ -0,0 +1,82 @@
import { useState } from 'react';
import { login, register } from '../api';
import './Login.css';
interface Props { onLogin: (token: string) => void }
export default function Login({ onLogin }: Props) {
const [username, setUsername] = useState('');
const [password, setPassword] = useState('');
const [error, setError] = useState('');
const [loading, setLoading] = useState(false);
async function doLogin() {
setError(''); setLoading(true);
try {
const data = await login(username, password);
localStorage.setItem('token', data.token);
onLogin(data.token);
} catch (e: any) { setError(e.message); }
setLoading(false);
}
async function doRegister() {
setError(''); setLoading(true);
try {
const data = await register(username, password);
localStorage.setItem('token', data.token);
onLogin(data.token);
} catch (e: any) { setError(e.message); }
setLoading(false);
}
return (
<div className="login-page">
<div className="login-bg-decor" />
<div className="login-card">
<div className="login-icon">
<span className="material-symbols-outlined">sms</span>
</div>
<h1>SMS Monitor</h1>
<p className="subtitle">短信管理与监控平台</p>
<div className="login-fields">
<div className="field">
<span className="material-symbols-outlined field-icon">person</span>
<input
type="text" placeholder="用户名" value={username}
onChange={e => setUsername(e.target.value)}
onKeyDown={e => e.key === 'Enter' && doLogin()}
/>
</div>
<div className="field">
<span className="material-symbols-outlined field-icon">lock</span>
<input
type="password" placeholder="密码" value={password}
onChange={e => setPassword(e.target.value)}
onKeyDown={e => e.key === 'Enter' && doLogin()}
/>
</div>
</div>
{error && (
<div className="error-msg">
<span className="material-symbols-outlined">error</span>
{error}
</div>
)}
<div className="login-buttons">
<button className="btn-primary" onClick={doLogin} disabled={loading}>
<span className="material-symbols-outlined">login</span>
登录
</button>
<button className="btn-ghost" onClick={doRegister} disabled={loading}>
<span className="material-symbols-outlined">person_add</span>
注册
</button>
</div>
</div>
</div>
);
}

155
web/src/pages/SmsList.css Normal file
View File

@@ -0,0 +1,155 @@
.sms-layout { display: flex; flex-direction: column; height: 100vh; }
/* Top Bar */
.topbar {
display: flex; justify-content: space-between; align-items: center;
padding: 14px 24px;
background: var(--bg-secondary);
border-bottom: 1px solid var(--border);
gap: 16px;
flex-shrink: 0;
}
.topbar-left { display: flex; align-items: center; gap: 12px; }
.topbar-logo {
width: 36px; height: 36px; background: var(--accent-subtle);
border-radius: var(--radius-sm);
display: flex; align-items: center; justify-content: center;
}
.topbar-logo .material-symbols-outlined { font-size: 20px; color: var(--accent); }
.topbar h2 { font-size: 1.1rem; font-weight: 600; letter-spacing: -0.01em; }
.topbar-right { display: flex; align-items: center; gap: 10px; }
.topbar .badge-count {
background: var(--bg-hover); color: var(--text-secondary);
padding: 5px 12px; border-radius: 20px; font-size: 0.8rem; font-weight: 500;
}
/* Filters Bar */
.filters-bar {
display: flex; gap: 10px; align-items: center;
padding: 12px 24px;
background: var(--bg-secondary);
border-bottom: 1px solid var(--border);
flex-shrink: 0;
}
.filters-bar input { width: 240px; }
.filters-bar select { width: 140px; }
.filters-bar .spacer { flex: 1; }
/* Main Content */
.sms-main { display: flex; flex: 1; overflow: hidden; }
/* Table */
.sms-table-wrap { flex: 1; overflow: auto; }
.sms-table { width: 100%; border-collapse: collapse; }
.sms-table thead { position: sticky; top: 0; z-index: 1; }
.sms-table th {
text-align: left; font-weight: 500; font-size: 0.75rem;
text-transform: uppercase; letter-spacing: 0.06em;
color: var(--text-muted);
padding: 12px 16px;
background: var(--bg-primary);
border-bottom: 1.5px solid var(--border);
}
.sms-table td {
padding: 14px 16px;
border-bottom: 1px solid var(--border);
font-size: 0.875rem;
}
.sms-table tbody tr {
transition: background var(--transition);
cursor: pointer;
}
.sms-table tbody tr:hover { background: var(--bg-hover); }
.sms-table tbody tr.selected {
background: var(--accent-subtle);
box-shadow: inset 3px 0 0 var(--accent);
}
.cell-contact { font-weight: 500; }
.cell-phone { font-family: 'JetBrains Mono', monospace; font-size: 0.8rem; color: var(--text-secondary); }
.cell-content {
max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cell-date { white-space: nowrap; font-size: 0.8rem; color: var(--text-muted); font-family: 'JetBrains Mono', monospace; }
.badge {
font-size: 0.7rem; font-weight: 600; padding: 3px 10px; border-radius: 20px;
text-transform: uppercase; letter-spacing: 0.04em;
}
.badge.received { background: var(--green-bg); color: var(--green); }
.badge.sent { background: var(--blue-bg); color: var(--blue); }
.table-empty { text-align: center; padding: 60px 20px; color: var(--text-muted); }
.table-empty .material-symbols-outlined { font-size: 48px; display: block; margin-bottom: 12px; opacity: 0.4; }
.table-empty p { font-size: 0.9rem; }
.table-loading { text-align: center; padding: 60px 20px; }
.table-loading .spinner {
width: 32px; height: 32px;
margin: 0 auto 12px;
border: 3px solid var(--border);
border-top-color: var(--accent);
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
/* Detail Panel */
.detail-panel {
width: 360px; padding: 28px 24px;
background: var(--bg-secondary);
border-left: 1px solid var(--border);
overflow-y: auto;
display: flex; flex-direction: column; gap: 16px;
flex-shrink: 0;
}
.detail-header { display: flex; justify-content: space-between; align-items: center; }
.detail-header h3 { font-size: 1rem; font-weight: 600; }
.detail-meta { display: flex; flex-direction: column; gap: 10px; }
.detail-row { display: flex; gap: 8px; align-items: baseline; }
.detail-label {
font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em;
color: var(--text-muted); width: 52px; flex-shrink: 0;
}
.detail-value { font-size: 0.875rem; color: var(--text-primary); }
.detail-value.mono { font-family: 'JetBrains Mono', monospace; font-size: 0.8rem; }
.detail-content-card {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: var(--radius); padding: 16px;
font-size: 0.9rem; line-height: 1.7;
white-space: pre-wrap; word-break: break-word;
color: var(--text-primary);
}
/* Pagination */
.pagination {
display: flex; justify-content: space-between; align-items: center;
padding: 12px 24px;
background: var(--bg-secondary);
border-top: 1px solid var(--border);
font-size: 0.85rem; color: var(--text-secondary);
flex-shrink: 0;
}
.pagination-info { font-weight: 500; }
.pagination-ctrl { display: flex; align-items: center; gap: 10px; }
.pagination-ctrl .btn-icon { padding: 6px 12px; }
.pagination-ctrl .page-num {
font-family: 'JetBrains Mono', monospace; font-size: 0.8rem;
color: var(--text-secondary);
}
/* Slide-in transition for detail panel */
.detail-panel {
animation: slideIn 0.2s ease-out;
}
@keyframes slideIn { from { transform: translateX(20px); opacity: 0.5; } }
@media (max-width: 768px) {
.topbar { flex-direction: column; align-items: flex-start; }
.filters-bar { flex-wrap: wrap; }
.filters-bar input { width: 100%; }
.sms-main { flex-direction: column; }
.detail-panel { width: 100%; border-left: none; border-top: 1px solid var(--border); }
}

177
web/src/pages/SmsList.tsx Normal file
View File

@@ -0,0 +1,177 @@
import { useEffect, useState } from 'react';
import { fetchSms, deleteSms, SmsMessage } from '../api';
import './SmsList.css';
interface Props { onLogout: () => void }
export default function SmsList({ onLogout }: Props) {
const [messages, setMessages] = useState<SmsMessage[]>([]);
const [page, setPage] = useState(1);
const [totalPages, setTotalPages] = useState(1);
const [total, setTotal] = useState(0);
const [loading, setLoading] = useState(true);
const [phone, setPhone] = useState('');
const [type, setType] = useState('');
const [detail, setDetail] = useState<SmsMessage | null>(null);
async function load(p: number) {
setLoading(true);
try {
const params: Record<string, string> = { page: String(p), limit: '20' };
if (phone) params.phone = phone;
if (type) params.type = type;
const data = await fetchSms(params);
setMessages(data.messages);
setTotalPages(data.totalPages);
setTotal(data.total);
} catch (e) { console.error(e); }
setLoading(false);
}
useEffect(() => {
load(1);
setPage(1);
}, [phone, type]);
useEffect(() => { load(page); }, [page]);
async function handleDelete(id: number) {
await deleteSms(id);
if (detail?.id === id) setDetail(null);
load(page);
}
function formatDate(d: string) {
const dt = new Date(d);
const pad = (n: number) => String(n).padStart(2, '0');
return `${dt.getFullYear()}-${pad(dt.getMonth()+1)}-${pad(dt.getDate())} ${pad(dt.getHours())}:${pad(dt.getMinutes())}`;
}
return (
<div className="sms-layout">
<header className="topbar">
<div className="topbar-left">
<div className="topbar-logo">
<span className="material-symbols-outlined">sms</span>
</div>
<h2>SMS Monitor</h2>
</div>
<div className="topbar-right">
<span className="badge-count">{total} 条消息</span>
<button className="btn-ghost" onClick={onLogout}>
<span className="material-symbols-outlined">logout</span>
退出
</button>
</div>
</header>
<div className="filters-bar">
<input
placeholder="按手机号筛选..." value={phone}
onChange={e => setPhone(e.target.value)}
onKeyDown={e => e.key === 'Enter' && (setPage(1), load(1))}
/>
<select value={type} onChange={e => setType(e.target.value)}>
<option value="">全部类型</option>
<option value="received">接收</option>
<option value="sent">发送</option>
</select>
<button className="btn-primary" onClick={() => { setPage(1); load(1); }}>
<span className="material-symbols-outlined">search</span>
搜索
</button>
</div>
<main className="sms-main">
<div className="sms-table-wrap">
<table className="sms-table">
<thead>
<tr>
<th>联系人</th>
<th>手机号</th>
<th>类型</th>
<th>内容</th>
<th>时间</th>
<th></th>
</tr>
</thead>
<tbody>
{loading ? (
<tr><td colSpan={6}>
<div className="table-loading"><div className="spinner" /></div>
</td></tr>
) : messages.length === 0 ? (
<tr><td colSpan={6}>
<div className="table-empty">
<span className="material-symbols-outlined">inbox</span>
<p>暂无消息</p>
</div>
</td></tr>
) : messages.map(m => (
<tr key={m.id} className={detail?.id === m.id ? 'selected' : ''} onClick={() => setDetail(m)}>
<td className="cell-contact">{m.contact_name || '—'}</td>
<td className="cell-phone">{m.phone_number}</td>
<td><span className={`badge ${m.type}`}>{m.type === 'received' ? '接收' : '发送'}</span></td>
<td className="cell-content">{m.content}</td>
<td className="cell-date">{formatDate(m.sms_date)}</td>
<td>
<button className="btn-danger" onClick={e => { e.stopPropagation(); handleDelete(m.id); }}>
<span className="material-symbols-outlined">delete</span>
</button>
</td>
</tr>
))}
</tbody>
</table>
</div>
{detail && (
<aside className="detail-panel">
<div className="detail-header">
<h3>消息详情</h3>
<button className="btn-icon" onClick={() => setDetail(null)}>
<span className="material-symbols-outlined">close</span>
</button>
</div>
<div className="detail-meta">
<div className="detail-row">
<span className="detail-label">联系人</span>
<span className="detail-value">{detail.contact_name || '—'}</span>
</div>
<div className="detail-row">
<span className="detail-label">手机号</span>
<span className="detail-value mono">{detail.phone_number}</span>
</div>
<div className="detail-row">
<span className="detail-label">类型</span>
<span className={`badge ${detail.type}`}>{detail.type === 'received' ? '接收' : '发送'}</span>
</div>
<div className="detail-row">
<span className="detail-label">时间</span>
<span className="detail-value">{formatDate(detail.sms_date)}</span>
</div>
</div>
<div className="detail-content-card">{detail.content}</div>
<button className="btn-danger" style={{ justifyContent: 'center', padding: '10px' }} onClick={() => handleDelete(detail.id)}>
<span className="material-symbols-outlined">delete</span>
删除此消息
</button>
</aside>
)}
</main>
<footer className="pagination">
<span className="pagination-info">共 {total} 条</span>
<div className="pagination-ctrl">
<button className="btn-icon" disabled={page <= 1} onClick={() => setPage(p => p - 1)}>
<span className="material-symbols-outlined">chevron_left</span>
</button>
<span className="page-num">{page} / {totalPages || 1}</span>
<button className="btn-icon" disabled={page >= totalPages} onClick={() => setPage(p => p + 1)}>
<span className="material-symbols-outlined">chevron_right</span>
</button>
</div>
</footer>
</div>
);
}

21
web/tsconfig.json Normal file
View File

@@ -0,0 +1,21 @@
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"lib": ["ES2020", "DOM", "DOM.Iterable"],
"module": "ESNext",
"skipLibCheck": true,
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"isolatedModules": true,
"moduleDetection": "force",
"noEmit": true,
"jsx": "react-jsx",
"strict": true,
"noUnusedLocals": false,
"noUnusedParameters": false,
"noFallthroughCasesInSwitch": true,
"forceConsistentCasingInFileNames": true
},
"include": ["src"]
}

12
web/vite.config.ts Normal file
View File

@@ -0,0 +1,12 @@
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
export default defineConfig({
plugins: [react()],
server: {
port: 5173,
proxy: {
'/api': 'http://localhost:3000',
},
},
});