@mcpc-tech/unplugin-dev-inspector-mcp 0.0.7 → 0.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -71,27 +71,29 @@ pnpm add -D @mcpc-tech/unplugin-dev-inspector-mcp
71
71
  yarn add -D @mcpc-tech/unplugin-dev-inspector-mcp
72
72
  ```
73
73
 
74
- ```typescript
75
- // vite.config.ts
76
- import DevInspector from '@mcpc-tech/unplugin-dev-inspector-mcp';
77
- import react from '@vitejs/plugin-react'; // or vue()
74
+ Add DevInspector to your project:
78
75
 
79
- export default {
80
- plugins: [
81
- DevInspector.vite({
82
- enabled: true,
83
- enableMcp: true,
84
- }),
85
- react(), // or vue()
86
- ],
87
- };
88
- ```
76
+ ### Vite
89
77
 
90
- > 💡 **Troubleshooting:** If source locations show `unknown:0:0`, try moving `DevInspector.vite()` **before** framework plugins like `react()`, `vue()`, or `preact()`. This ensures source location injection happens before JSX transformation.
78
+ ```diff
79
+ // vite.config.ts
80
+ +import DevInspector from '@mcpc-tech/unplugin-dev-inspector-mcp';
81
+ import react from '@vitejs/plugin-react'; // or vue()
82
+
83
+ export default {
84
+ plugins: [
85
+ + DevInspector.vite({
86
+ + enabled: true,
87
+ + enableMcp: true,
88
+ + }),
89
+ react(), // or vue()
90
+ ],
91
+ };
92
+ ```
91
93
 
92
- Currently supports **Vite**. Webpack, Rollup, esbuild, and Rspack support coming soon.
94
+ > ⚠️ **Plugin order matters:** Place `DevInspector.vite()` **before** `react()`, `vue()`, or `preact()`. Otherwise source locations may show `unknown:0:0`.
93
95
 
94
- ### For Non-HTML Projects (Miniapps, Library Bundles)
96
+ #### For Non-HTML Projects (Miniapps, Library Bundles)
95
97
 
96
98
  If your project doesn't use HTML files (e.g., miniapp platforms that only bundle JS):
97
99
 
@@ -110,7 +112,7 @@ import 'virtual:dev-inspector-mcp'; // ← Add this import
110
112
 
111
113
  **✅ Zero Production Impact:** This import is automatically removed in production builds via tree-shaking. The entire dev-inspector code is wrapped in `if (import.meta.env.DEV)` guards, which bundlers statically replace with `false` during production builds.
112
114
 
113
- #### Custom Virtual Module Name
115
+ ##### Custom Virtual Module Name
114
116
 
115
117
  If `virtual:dev-inspector-mcp` conflicts with your project, you can customize it:
116
118
 
@@ -128,13 +130,70 @@ DevInspector.vite({
128
130
  import 'virtual:my-custom-inspector'; // ← Use your custom name
129
131
  ```
130
132
 
133
+ ### Webpack
134
+
135
+ ```diff
136
+ // webpack.config.js
137
+ +const DevInspector = require('@mcpc-tech/unplugin-dev-inspector-mcp');
138
+
139
+ module.exports = {
140
+ plugins: [
141
+ + DevInspector.webpack({
142
+ + enabled: true,
143
+ + enableMcp: true,
144
+ + }),
145
+ ],
146
+ };
147
+ ```
148
+
149
+ ### Next.js
150
+
151
+ ```diff
152
+ // next.config.ts
153
+ +import DevInspector from '@mcpc-tech/unplugin-dev-inspector-mcp';
154
+
155
+ const nextConfig: NextConfig = {
156
+ + webpack: (config) => {
157
+ + config.plugins.push(
158
+ + DevInspector.webpack({
159
+ + enabled: true,
160
+ + })
161
+ + );
162
+ + return config;
163
+ + },
164
+ };
165
+
166
+ export default nextConfig;
167
+ ```
168
+
169
+ Then add to your root layout:
170
+
171
+ ```tsx
172
+ // app/layout.tsx
173
+ import { DevInspector } from "@mcpc-tech/unplugin-dev-inspector-mcp/next";
174
+
175
+ export default function RootLayout({ children }) {
176
+ return (
177
+ <html>
178
+ <body>
179
+ <DevInspector />
180
+ {children}
181
+ </body>
182
+ </html>
183
+ );
184
+ }
185
+ ```
186
+
187
+ > 💡 **Note:** Webpack and Next.js use a standalone server on port 8888. Run `next dev --webpack` for Webpack mode (Next.js 16+ defaults to Turbopack).
188
+
189
+
131
190
  ## Configuration
132
191
 
133
192
  ### Auto-Update MCP Config
134
193
 
135
194
  The plugin automatically updates MCP configuration files for detected editors when the dev server starts. This saves you from manually configuring MCP endpoints.
136
195
 
137
- **Supported editors:** Cursor, VSCode, Windsurf, Claude Code
196
+ **Supported editors:** Cursor, VSCode, Windsurf, Claude Code, Antigravity
138
197
 
139
198
  ```typescript
140
199
  // vite.config.ts