0
# Module Inspection
1

2
Access to detailed information about module transformations, dependencies, and plugin interactions during the Vite build process.
3

4
## Capabilities
5

6
### Module Information
7

8
Comprehensive information about individual modules including size, timing, and plugin interactions.
9

10
```typescript { .api }
11
interface ModuleInfo {
12
  /** Unique module identifier (file path or virtual ID) */
13
  id: string;
14
  /** Plugins that processed this module with timing info */
15
  plugins: { name: string; transform?: number; resolveId?: number; }[];
16
  /** Array of module IDs this module depends on */
17
  deps: string[];
18
  /** Array of module IDs that import this module */
19
  importers: string[];
20
  /** Whether this is a virtual module (not a real file) */
21
  virtual: boolean;
22
  /** Total processing time for this module in milliseconds */
23
  totalTime: number;
24
  /** Number of times this module was processed */
25
  invokeCount: number;
26
  /** Original source code size in bytes */
27
  sourceSize: number;
28
  /** Final transformed code size in bytes */
29
  distSize: number;
30
}
31

32
/** Array of module information objects */
33
type ModulesList = ModuleInfo[];
34
```
35

36
**Usage Example:**
37

38
```typescript
39
// Via RPC API
40
const modules = await rpc.getModulesList({ vite: 'instance-id', env: 'client' });
41

42
modules.forEach(module => {
43
  console.log(`Module: ${module.id}`);
44
  console.log(`Size change: ${module.sourceSize} -> ${module.distSize}`);
45
  console.log(`Processing time: ${module.totalTime}ms`);
46
  console.log(`Processed by: ${module.plugins.map(p => p.name).join(', ')}`);
47
});
48
```
49

50
### Module Transformation Details
51

52
Detailed information about how a specific module was transformed by each plugin.
53

54
```typescript { .api }
55
interface ModuleTransformInfo {
56
  /** The resolved module ID */
57
  resolvedId: string;
58
  /** Array of transformations applied to this module */
59
  transforms: TransformInfo[];
60
}
61

62
interface TransformInfo {
63
  /** Name of the plugin that performed this transformation */
64
  name: string;
65
  /** Transformed code result (optional) */
66
  result?: string;
67
  /** Transformation start time in milliseconds */
68
  start: number;
69
  /** Transformation end time in milliseconds */
70
  end: number; 
71
  /** Plugin execution order identifier */
72
  order?: string;
73
  /** Source maps generated by this transformation */
74
  sourcemaps?: any;
75
  /** Error information if transformation failed */
76
  error?: ParsedError;
77
}
78
```
79

80
**Usage Example:**
81

82
```typescript
83
// Get detailed transformation info for a specific module
84
const transformInfo = await rpc.getModuleTransformInfo(
85
  { vite: 'instance-id', env: 'client' },
86
  '/src/components/MyComponent.vue',
87
  false // don't clear cache
88
);
89

90
console.log(`Transformations for: ${transformInfo.resolvedId}`);
91
transformInfo.transforms.forEach(transform => {
92
  const duration = transform.end - transform.start;
93
  console.log(`${transform.name}: ${duration}ms`);
94
  if (transform.error) {
95
    console.error(`Error in ${transform.name}:`, transform.error.message);
96
  }
97
});
98
```
99

100
### Module Resolution Information
101

102
Information about how module IDs are resolved by different plugins.
103

104
```typescript { .api }
105
interface ResolveIdInfo {
106
  /** Name of the plugin that performed the resolution */
107
  name: string;
108
  /** The resolved result (file path or virtual ID) */
109
  result: string;
110
  /** Resolution start time in milliseconds */
111
  start: number;
112
  /** Resolution end time in milliseconds */
113
  end: number;
114
  /** Plugin execution order identifier */
115
  order?: string;
116
  /** Error information if resolution failed */
117
  error?: ParsedError;
118
}
119
```
120

121
### Error Information
122

123
Structured error information with stack traces for failed transformations.
124

125
```typescript { .api }
126
interface ParsedError {
127
  /** Error message */
128
  message: string;
129
  /** Parsed stack trace frames */
130
  stack: StackFrame[];
131
  /** Raw error object */
132
  raw?: any;
133
}
134
```
135

136
Note: `StackFrame` is imported from the `error-stack-parser-es` library and provides structured stack trace information.
137

138
### Module Dependencies
139

140
Understanding module dependency relationships:
141

142
```typescript
143
// Example: Finding all dependencies of a module
144
const module = modules.find(m => m.id === '/src/main.ts');
145
if (module) {
146
  console.log('Dependencies:', module.deps);
147
  console.log('Imported by:', module.importers);
148
  
149
  // Find circular dependencies
150
  const circularDeps = module.deps.filter(dep => 
151
    modules.find(m => m.id === dep)?.deps.includes(module.id)
152
  );
153
  if (circularDeps.length > 0) {
154
    console.warn('Circular dependencies detected:', circularDeps);
155
  }
156
}
157
```
158

159
### Virtual Module Detection
160

161
Identifying and working with virtual modules:
162

163
```typescript
164
// Find all virtual modules
165
const virtualModules = modules.filter(m => m.virtual);
166
console.log('Virtual modules:', virtualModules.map(m => m.id));
167

168
// Virtual modules often have special prefixes or patterns
169
const pluginVirtualModules = virtualModules.filter(m => 
170
  m.id.startsWith('virtual:') || m.id.includes('?')
171
);
172
```
173

174
### Performance Analysis
175

176
Analyzing module processing performance:
177

178
```typescript
179
// Find slowest modules to process
180
const slowestModules = modules
181
  .sort((a, b) => b.totalTime - a.totalTime)
182
  .slice(0, 10);
183

184
console.log('Top 10 slowest modules:');
185
slowestModules.forEach((module, index) => {
186
  console.log(`${index + 1}. ${module.id} - ${module.totalTime}ms`);
187
});
188

189
// Find modules with size increases
190
const bloatedModules = modules
191
  .filter(m => m.distSize > m.sourceSize * 1.5)
192
  .sort((a, b) => (b.distSize - b.sourceSize) - (a.distSize - a.sourceSize));
193

194
console.log('Modules with significant size increases:');
195
bloatedModules.forEach(module => {
196
  const increase = ((module.distSize - module.sourceSize) / module.sourceSize * 100).toFixed(1);
197
  console.log(`${module.id}: +${increase}%`);
198
});
199
```