0
# Plugin Configuration
1

2
Core configuration options for the vite-plugin-checker plugin, including shared settings that apply to all checker types.
3

4
## Capabilities
5

6
### Main Plugin Function
7

8
Creates a Vite plugin instance with the specified checker configuration.
9

10
```typescript { .api }
11
/**
12
 * Creates a vite-plugin-checker plugin instance
13
 * @param userConfig - Configuration for all checkers and shared options
14
 * @returns Vite plugin instance
15
 */
16
function checker(userConfig: UserPluginConfig): Plugin;
17

18
interface UserPluginConfig extends SharedConfig, BuildInCheckers {}
19
```
20

21
**Usage Example:**
22

23
```typescript
24
import { defineConfig } from "vite";
25
import checker from "vite-plugin-checker";
26

27
export default defineConfig({
28
  plugins: [
29
    checker({
30
      // Shared configuration
31
      overlay: true,
32
      terminal: true,
33
      enableBuild: true,
34
      root: './src',
35
      
36
      // Individual checker configurations
37
      typescript: true,
38
      eslint: {
39
        lintCommand: 'eslint "./src/**/*.{ts,tsx}"',
40
      },
41
    }),
42
  ],
43
});
44
```
45

46
### Shared Configuration
47

48
Configuration options that apply to all checker types.
49

50
```typescript { .api }
51
interface SharedConfig {
52
  /**
53
   * Show overlay on UI view when there are errors or warnings in dev mode
54
   * @default true
55
   */
56
  overlay: boolean | OverlayConfig;
57
  
58
  /**
59
   * Enable terminal output for checker results
60
   * @default true
61
   */
62
  terminal: boolean;
63
  
64
  /**
65
   * Enable checking in build mode
66
   * @default true
67
   */
68
  enableBuild: boolean;
69
  
70
  /**
71
   * Root directory for checkers (optional)
72
   */
73
  root?: string;
74
}
75
```
76

77
### Overlay Configuration
78

79
Detailed configuration for the development error overlay system.
80

81
```typescript { .api }
82
interface OverlayConfig {
83
  /**
84
   * Set true if you want the overlay to default to being open if errors/warnings are found
85
   * @default true
86
   */
87
  initialIsOpen?: boolean | 'error';
88
  
89
  /**
90
   * Position of the vite-plugin-checker badge to open and close the diagnostics panel
91
   * @default 'bl'
92
   */
93
  position?: 'tl' | 'tr' | 'bl' | 'br';
94
  
95
  /**
96
   * Extra style string for the badge button (CSS property format)
97
   * Example: 'display: none;' to hide the badge
98
   */
99
  badgeStyle?: string;
100
  
101
  /**
102
   * Extra style string for the diagnostic panel (CSS property format)
103
   * Example: 'opacity: 0.8;' to change panel opacity
104
   */
105
  panelStyle?: string;
106
}
107
```
108

109
**Usage Example:**
110

111
```typescript
112
checker({
113
  overlay: {
114
    initialIsOpen: 'error', // Only open on errors, not warnings
115
    position: 'tr',         // Top-right position
116
    badgeStyle: 'right: 80px; top: 20px;', // Custom badge positioning
117
    panelStyle: 'opacity: 0.95; backdrop-filter: blur(3px);', // Semi-transparent panel
118
  },
119
  terminal: true,
120
  enableBuild: true,
121
});
122
```
123

124
### Built-in Checkers Interface
125

126
Interface defining all available checker types that can be configured.
127

128
```typescript { .api }
129
interface BuildInCheckers {
130
  /** TypeScript checker configuration */
131
  typescript?: TscConfig;
132
  
133
  /** Vue TypeScript checker configuration */
134
  vueTsc?: VueTscConfig;
135
  
136
  /** Vue Language Server checker configuration */
137
  vls?: VlsConfig;
138
  
139
  /** ESLint checker configuration */
140
  eslint?: EslintConfig;
141
  
142
  /** Stylelint checker configuration */
143
  stylelint?: StylelintConfig;
144
  
145
  /** Biome checker configuration */
146
  biome?: BiomeConfig;
147
}
148
```
149

150
### Plugin Information
151

152
The plugin includes metadata and internal properties accessible for advanced use cases.
153

154
```typescript { .api }
155
interface VitePluginChecker extends Plugin {
156
  name: 'vite-plugin-checker';
157
  enforce: 'pre';
158
  __internal__checker: typeof Checker;
159
}
160
```
161

162
**Plugin Lifecycle Methods:**
163

164
- `config()` - Initializes checkers during Vite configuration phase
165
- `configResolved()` - Stores resolved Vite configuration
166
- `buildStart()` - Starts checker processes in build mode
167
- `buildEnd()` - Cleans up checker processes
168
- `configureServer()` - Sets up development server integration
169
- `resolveId()` - Handles virtual module resolution for client runtime
170
- `load()` - Provides client runtime code
171
- `transformIndexHtml()` - Injects client runtime in development mode
172

173
### Environment Detection
174

175
Internal utilities for detecting the runtime environment.
176

177
```typescript { .api }
178
/** 
179
 * Built-in checker names supported by the plugin 
180
 */
181
const buildInCheckerKeys: BuildInCheckerNames[];
182

183
type BuildInCheckerNames = 'typescript' | 'vueTsc' | 'vls' | 'eslint' | 'stylelint' | 'biome';
184
```