![]() This commit includes several improvements and new features: - Updated the WebSocket connection logic in `websocket.py` to include connection status messages and periodic pings for maintaining the connection. - Introduced new skeleton components (`Skeleton.vue`, `SkeletonDashboard.vue`, `SkeletonList.vue`) for improved loading states in the UI, enhancing user experience during data fetching. - Refactored the Vite configuration to support advanced code splitting and caching strategies, optimizing the build process. - Enhanced ESLint configuration for better compatibility with project structure. These changes aim to improve real-time communication, user interface responsiveness, and overall application performance. |
||
---|---|---|
.. | ||
.vscode | ||
dev-dist | ||
e2e | ||
public | ||
src | ||
.editorconfig | ||
.env | ||
.gitattributes | ||
.gitignore | ||
.prettierrc.json | ||
Dockerfile | ||
Dockerfile.prod | ||
env.d.ts | ||
eslint.config.ts | ||
index.html | ||
package-lock.json | ||
package.json | ||
playwright.config.ts | ||
postcss.config.cjs | ||
README.md | ||
tailwind.config.ts | ||
tsconfig.app.json | ||
tsconfig.json | ||
tsconfig.node.json | ||
tsconfig.vitest.json | ||
vite.config.ts | ||
vitest.config.ts |
fe
This template should help get you started developing with Vue 3 in Vite.
Recommended IDE Setup
VSCode + Volar (and disable Vetur).
Type Support for .vue
Imports in TS
TypeScript cannot handle type information for .vue
imports by default, so we replace the tsc
CLI with vue-tsc
for type checking. In editors, we need Volar to make the TypeScript language service aware of .vue
types.
Customize configuration
See Vite Configuration Reference.
Project Setup
npm install
Compile and Hot-Reload for Development
# Frontend only
npm run dev:fe
# Start both frontend & backend in two terminals
npm run dev:be
npm run dev:fe
Type-Check, Compile and Minify for Production
npm run build
Run Unit Tests with Vitest
npm run test:unit
Run End-to-End Tests with Playwright
# Install browsers for the first run
npx playwright install
# When testing on CI, must build the project first
npm run build
# Runs the end-to-end tests
npm run test:e2e
# Runs the tests only on Chromium
npm run test:e2e -- --project=chromium
# Runs the tests of a specific file
npm run test:e2e -- tests/example.spec.ts
# Runs the tests in debug mode
npm run test:e2e -- --debug
Lint with ESLint
npm run lint