Practical WebSocket Client with Auto-Reconnection and Real-Time Message Push for Vue 3

import EventBus from "@/utils/EventBus"; import { WS_ERROR_EVENT } from "@/config/constants"; import { getAuthToken } from "@/utils/auth"; const WS_BASE_URL = import.meta.env.VITE_WS_BASE_URL; class WebSocketClient { private enableAutoReconnect: boolean = true; public reconnectAttempts: number = 0; private ...

Posted on Fri, 08 May 2026 01:50:18 +0000 by johnnyboy16

Implementing Internationalization in Vue 3 with vue-i18n

vue-i18n serves as the standard solution for adding internationalization support to Vue aplications. This guide demonstrates how to configure and use this library in a Vue 3 project. Installation Execute the following command in your Vue project directory: pnpm install vue-i18n Configuration 1. Directory Structure This example supports Chinese ...

Posted on Thu, 07 May 2026 18:54:46 +0000 by djsl

Implementing a Steps Component in Vue 3

This comopnent provides a visual indicator for a process consisting of sequential steps. It supports horizontal and vertical layouts, configurable sizes, and interactive step selection. Core Properties items: An array of step objects, each containing optional title and description fields. width: Controls the total width of the component; accep ...

Posted on Thu, 07 May 2026 12:54:00 +0000 by Barand