54 lines
1.7 KiB
Markdown
54 lines
1.7 KiB
Markdown
---
|
|
description: Frontend development rules for HealthLink-HIS Vue 3/Element Plus code
|
|
paths:
|
|
- "healthlink-his-ui/src/**/*.{vue,js,ts,jsx,tsx}"
|
|
- "healthlink-his-ui/package.json"
|
|
- "healthlink-his-ui/vite.config.js"
|
|
---
|
|
|
|
# Frontend Development Rules
|
|
|
|
## Tech stack
|
|
- Vue 3.5 + Vite 6.4 + Element Plus 2.14 + Pinia 2.2 + TypeScript 5.9
|
|
- Based on RuoYi-Vue3 framework
|
|
|
|
## Directory structure
|
|
```
|
|
src/api/{module}/ # API interfaces
|
|
src/views/{module}/ # Page components
|
|
src/store/modules/ # Pinia state management
|
|
src/components/ # Shared components
|
|
```
|
|
|
|
## Key constraints
|
|
- API prefix: `/healthlink-his/api/v1/`
|
|
- Route lazy loading: `() => import('@/views/xxx/index.vue')`
|
|
- Use `<script setup>` syntax for all pages
|
|
- Button permissions: `v-hasPermi` directive
|
|
- Cleanup: events registered in `onMounted` must be removed in `onUnmounted`
|
|
|
|
## Iron Laws (Frontend)
|
|
- **Iron Law 4**: API paths must align with backend (`/healthlink-his/api/v1/`)
|
|
- **Iron Law 18**: Never break existing page component structure when adding new pages
|
|
- **Iron Law 23**: Always use UTF-8 encoding when reading/writing files (PowerShell trap)
|
|
- **Iron Law 30**: Frontend compilation is mandatory — `npm run build:dev` must pass
|
|
|
|
## SCSS rules
|
|
- Check bracket closure in `<style lang="scss" scoped>` blocks
|
|
- All `{}` must be paired
|
|
- Compilation errors must be fixed immediately
|
|
|
|
## Verification commands
|
|
```bash
|
|
cd healthlink-his-ui
|
|
npm run build:dev # Build verification
|
|
npm run lint # ESLint check
|
|
npm run test:run # Vitest unit tests
|
|
```
|
|
|
|
## Common patterns
|
|
- Use Element Plus components (ElTable, ElForm, ElDialog)
|
|
- Use vxe-table for complex data grids
|
|
- Use ECharts for charts and visualizations
|
|
- Use vue-plugin-hiprint for printing
|