@@ -35,11 +35,50 @@ startSubprocess({
3535})
3636```
3737
38- ### ` getProcess ()` is deprecated
38+ ### ` startSubprocess ()` is deprecated {#ndt_dep_0004}
3939
40- The return value of ` startSubprocess() ` now provides ` getResult() ` instead of ` getProcess() ` .
40+ ` startSubprocess() ` is soft-deprecated in favour of the Vite DevTools terminals
41+ host, used from the [ ` onDevtoolsReady ` ] ( /module/utils-kit#ondevtoolsready ) hook.
42+ It still works as a shim, but emits the ` NDT_DEP_0004 ` deprecation diagnostic.
4143
42- - ` getProcess() ` still works but logs a deprecation warning and returns ` ChildProcess | undefined ` (was ` ExecaChildProcess<string> ` )
44+ ``` diff
45+ - import { startSubprocess } from '@nuxt/devtools-kit'
46+ + import { onDevtoolsReady } from '@nuxt/devtools-kit'
47+
48+ - const subprocess = startSubprocess(
49+ - { command: 'vite', args: ['build', '--watch'] },
50+ - { id: 'my-module:build', name: 'Build', icon: 'ph:terminal-duotone' },
51+ - )
52+ + onDevtoolsReady(async (ctx) => {
53+ + const session = await ctx.terminals.startChildProcess(
54+ + { command: 'vite', args: ['build', '--watch'], cwd: process.cwd() },
55+ + { id: 'my-module:build', title: 'Build', icon: 'ph:terminal-duotone' },
56+ + )
57+ + })
58+ ```
59+
60+ The terminals host session exposes ` terminate() ` , ` restart() ` ,
61+ ` getChildProcess() ` , and ` getResult() ` — a ` tinyexec ` -style awaitable handle that
62+ resolves to ` { stdout, stderr, exitCode } ` — so the ` startSubprocess().getResult() `
63+ ergonomics carry over:
64+
65+ ``` ts
66+ onDevtoolsReady (async (ctx ) => {
67+ const = await ctx .terminals .startChildProcess (
68+ { command: ' npm' ' install'
69+ { id: ' my-module:install' ' Install'
70+ )
71+ const = await session .getResult ()
72+ if (exitCode !== 0 )
73+ console .error (stderr )
74+ })
75+ ```
76+
77+ ### ` getProcess() ` is deprecated {#ndt_dep_0001}
78+
79+ The return value of ` startSubprocess() ` now also provides ` getResult() ` ; use it instead of the deprecated ` getProcess() ` method.
80+
81+ - ` getProcess() ` still works but emits the ` NDT_DEP_0001 ` deprecation diagnostic and returns ` ChildProcess | undefined ` (was ` ExecaChildProcess<string> ` )
4382- ` getResult() ` returns a tinyexec ` Result ` object with ` .kill() ` , ` .process ` , ` .pipe() ` , and more
4483
4584``` diff
@@ -51,6 +90,101 @@ const subprocess = startSubprocess(/* ... */)
5190+ result.process?.stdout?.on('data', handler)
5291```
5392
93+ ## ` extendServerRpc() ` is deprecated {#ndt_dep_0003}
94+
95+ ` extendServerRpc() ` is soft-deprecated in favour of the Vite DevTools RPC
96+ registration, done from the [ ` onDevtoolsReady ` ] ( /module/utils-kit#ondevtoolsready )
97+ hook. It still works as a shim, but emits the ` NDT_DEP_0003 ` deprecation
98+ diagnostic.
99+
100+ ``` diff
101+ - import { extendServerRpc } from '@nuxt/devtools-kit'
102+ + import { onDevtoolsReady } from '@nuxt/devtools-kit'
103+ + import { defineRpcFunction } from '@vitejs/devtools-kit'
104+
105+ - const rpc = extendServerRpc('my-module', {
106+ - async getData() {
107+ - return 'hello'
108+ - },
109+ - })
110+ + onDevtoolsReady((ctx) => {
111+ + ctx.rpc.register(defineRpcFunction({
112+ + name: 'my-module:get-data',
113+ + type: 'query',
114+ + setup: () => ({ handler: async () => 'hello' }),
115+ + }))
116+ + })
117+ ```
118+
119+ To broadcast to clients from the same context, use ` ctx.rpc.broadcast({ method, args, event }) ` .
120+
121+ ## ` nuxt.devtools.rpc ` direct access is deprecated {#ndt_dep_0007}
122+
123+ Directly accessing ` nuxt.devtools.rpc.broadcast ` or ` nuxt.devtools.rpc.functions `
124+ is deprecated (` NDT_DEP_0007 ` ). They still work as a shim, but you should use the
125+ connected ` ctx.rpc ` (the devframe ` RpcFunctionsHost ` ) from the
126+ [ ` onDevtoolsReady ` ] ( /module/utils-kit#ondevtoolsready ) hook instead:
127+
128+ ``` diff
129+ - nuxt.devtools.rpc.broadcast.myEvent.asEvent(payload)
130+ + onDevtoolsReady((ctx) => {
131+ + ctx.rpc.broadcast({ method: 'myEvent', args: [payload], event: true })
132+ + })
133+
134+ - nuxt.devtools.rpc.functions.myFn = handler
135+ + onDevtoolsReady((ctx) => {
136+ + ctx.rpc.register({ name: 'myFn', handler })
137+ + })
138+ ```
139+
140+ ## ` addCustomTab() ` is deprecated {#ndt_dep_0005}
141+
142+ ` addCustomTab() ` is soft-deprecated in favour of registering a dock entry on the
143+ Vite DevTools docks host, from the
144+ [ ` onDevtoolsReady ` ] ( /module/utils-kit#ondevtoolsready ) hook. It still works as a
145+ shim, but emits the ` NDT_DEP_0005 ` deprecation diagnostic.
146+
147+ ``` diff
148+ - import { addCustomTab } from '@nuxt/devtools-kit'
149+ + import { onDevtoolsReady } from '@nuxt/devtools-kit'
150+
151+ - addCustomTab({
152+ - name: 'my-module',
153+ - title: 'My Module',
154+ - icon: 'carbon:apps',
155+ - view: { type: 'iframe', src: '/url-to-your-module-view' },
156+ - })
157+ + onDevtoolsReady((ctx) => {
158+ + ctx.docks.register({
159+ + id: 'my-module',
160+ + title: 'My Module',
161+ + icon: 'carbon:apps',
162+ + type: 'iframe',
163+ + url: '/url-to-your-module-view',
164+ + })
165+ + })
166+ ```
167+
168+ :: warning
169+ The docks host does not yet cover the Nuxt-specific custom-tab features such as
170+ ` vnode ` views or tab categories. If you rely on those, keep using
171+ ` addCustomTab() ` for now.
172+ ::
173+
174+ ## ` refreshCustomTabs() ` is deprecated {#ndt_dep_0006}
175+
176+ ` refreshCustomTabs() ` is soft-deprecated (` NDT_DEP_0006 ` ). With the docks host you
177+ no longer re-run a hook to refresh — update the dock entry directly via the
178+ handle returned by ` register() ` inside the
179+ [ ` onDevtoolsReady ` ] ( /module/utils-kit#ondevtoolsready ) hook:
180+
181+ ``` ts
182+ onDevtoolsReady ((ctx ) => {
183+ const = ctx .docks .register ({ id: ' my-module' /* ... */
184+ entry .update ({ title: ' My Module (updated)'
185+ })
186+ ```
187+
54188## Global Install Support Removed
55189
56190Nuxt DevTools no longer supports being installed globally.
0 commit comments