celeris-web
Celeris Web is a highly performant and customizable front-end development template built with Vue 3, Vite, and TypeScript. It features the latest syntax, components and APIs auto importing, state management, Chinese font presets, internationalization, and integration with OpenAI's ChatGPT API.
Learn how to extend or override Celeris Web component styles using Tailwind utility classes, class props, CSS variables, or scoped styles for ultimate design control.
Celeris Web Request Interceptor and Response Handling: Architecture and ImplementationExplore Celeris Web's request interceptor and response handling architecture. Discover how it cancels duplicates, injects auth tokens, and transforms responses globally.
How to Add UnoCSS Preset Configurations to Celeris Web: A Complete GuideEasily add UnoCSS preset configurations to Celeris Web by installing and registering your preset. Learn how the Vite plugin automatically applies changes across the monorepo.
How to Customize Page Transition Animations in Celeris Web: A Complete GuideCustomize page transition animations in Celeris Web using a three-layer architecture: global settings, per-route meta, and CSS classes. Master route transitions with this complete guide.
How the Multi-Tab System with Keep-Alive Works in Celeris WebDiscover how Celeris Web's multi-tab system with keep-alive efficiently manages tab state. Learn about reactive tab stores and Vue's `<keep-alive>` for seamless component caching and state preservation.
How to Configure Sidebar and Header Settings in Celeris WebConfigure sidebar and header settings in Celeris Web via the ProjectSetting object and Pinia store. Learn how to define layouts and manage reactive state for your admin panel.
How to Use the SearchDialog Component for Global Search in Celeris WebImplement global search in Celeris Web using the SearchDialog component. Aggregate router menu items and custom groups for a seamless user experience. Learn how to trigger search anywhere.
How TanStack Table Integration Facilitates Data Table Creation in Celeris WebDiscover how TanStack Table integration in Celeris Web simplifies data table creation. Learn about its type-safe API, column helpers, and composable instances for efficient grid building.
How to Add a New Page Component to the Celeris Web ApplicationLearn how developers add a new page component to the Celeris Web application. Extend the admin panel by creating a Vue component and registering it as a typed route module.
How Environment Variables Are Configured for Different Deployment Environments in Celeris WebLearn how Celeris Web configures environment variables for deployment using Vite's .env system and a custom TypeScript wrapper. Securely manage .env.development, .env.test, and .env.production.
How to Create Custom Directives (e.g., `v-permission`) in Celeris WebLearn to create custom directives like v-permission in Celeris Web. Implement Vue directives with mounted hooks for permission checks and element removal. Register globally for streamlined access control.
How Vite Configuration Is Managed and Applied via the @celeris/vite PackageLearn how @celeris/vite manages Vite configuration by merging defaults with your overrides for efficient build-time application.
Have a question about this repo?
These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:
curl -s "https://instagit.com/install.md" 
Maintain an open-source project? Get it listed too →